<!DOCTYPE html>
<html lang="en-US" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <title>DatePicker | Element Plus</title>
    <meta name="description" content="A Vue 3 based component library for designers and developers">
    <meta name="generator" content="VitePress v1.2.3">
    <link rel="preload stylesheet" href="/assets/style.B_e9f5k0.css" as="style">
    
    <script type="module" src="/assets/app.GpHgi9kG.js"></script>
    <link rel="modulepreload" href="/assets/chunks/framework.DcRevfCx.js">
    <link rel="modulepreload" href="/assets/chunks/theme.8dELuM1T.js">
    <link rel="modulepreload" href="/assets/chunks/contributors.DlPZCFvS.js">
    <link rel="modulepreload" href="/assets/chunks/year-range.CrQkHHkM.js">
    <link rel="modulepreload" href="/assets/en-US_component_date-picker.md.UbBGLRRy.lean.js">
    <link rel="icon" href="/images/element-plus-logo-small.svg" type="image/svg+xm">
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" sizes="180x180">
    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
    <meta name="theme-color" content="#ffffff">
    <meta name="msapplication-TileColor" content="#409eff">
    <meta name="msapplication-config" content="/browserconfig.xml">
    <meta property="og:image" content="/images/element-plus-og-image.png">
    <meta property="og:image:width" content="1200">
    <meta property="og:image:height" content="630">
    <meta property="og:description" content="A Vue 3 based component library for designers and developers">
    <script>window.supportedLangs=["en-US","es-ES","zh-CN"];</script>
    <script>(()=>{const o=window.supportedLangs,a="preferred_lang",r="en-US",s={en:"en-US",fr:"fr-FR",es:"es-ES"};let e=localStorage.getItem(a)||navigator.language;const n=s[e]||(o.includes(e)?e:r);if(localStorage.setItem(a,n),e=n,!location.pathname.startsWith(`/${e}`)){const t=[`/${e}`].concat(location.pathname.split("/").slice(2)).join("/");location.pathname=t.endsWith(".html")||t.endsWith("/")?t:t.concat("/")}navigator&&navigator.serviceWorker.controller&&navigator.serviceWorker.controller.postMessage({type:"LANG",lang:e})})();</script>
    <script async src="https://www.googletagmanager.com/gtag/js?id=UA-175337989-1"></script>
    <script>"serviceWorker"in navigator&&navigator.serviceWorker.register("/sw.js").then(function(o){console.log(o)}).catch(function(o){console.log(o)});</script>
    <script async>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments)}gtag("js",new Date),gtag("config","UA-175337989-1");</script>
    <script async src="https://www.googletagmanager.com/gtag/js?id=G-M74ZHEQ1M1"></script>
    <script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments)}gtag("js",new Date),gtag("config","G-M74ZHEQ1M1");</script>
    <script async>var resource=document.createElement("link");resource.setAttribute("rel","stylesheet"),resource.setAttribute("href","https://fonts.googleapis.com/css?family=Inter:300,400,500,600,700,800|Open+Sans:400,600;display=swap"),resource.setAttribute("type","text/css");var head=document.querySelector("head");head.appendChild(resource);</script>
    <script id="check-dark-mode">(()=>{const e=localStorage.getItem("vitepress-theme-appearance")||"auto",a=window.matchMedia("(prefers-color-scheme: dark)").matches;(!e||e==="auto"?a:e==="dark")&&document.documentElement.classList.add("dark")})();</script>
    <script id="check-mac-os">document.documentElement.classList.toggle("mac",/Mac|iPhone|iPod|iPad/i.test(navigator.platform));</script>
  </head>
  <body><div id="el-popper-container-1024"><!--[--><div style="z-index:2001;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2002;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker has-sidebar" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><div class="el-picker-panel__sidebar"><!--[--><button type="button" class="el-picker-panel__shortcut">Today</button><button type="button" class="el-picker-panel__shortcut">Yesterday</button><button type="button" class="el-picker-panel__shortcut">A week ago</button><!--]--></div><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="normal disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month disabled" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="true" disabled type="button" class="el-button el-button--small is-disabled is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2003;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table is-week-mode" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2004;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style="display:none;"><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2005;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header el-date-picker__header--bordered"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2020 - 2029</span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label" style="display:none;">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><!--v-if--><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2020" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2020</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2021" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2021</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2022" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2022</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2023" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2023</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available today" aria-selected="true" aria-label="2024" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2024</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2025" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2025</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2026" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2026</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2027" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2027</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2028" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2028</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2029" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2029</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2006;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header el-date-picker__header--bordered"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2020 - 2029</span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label" style="display:none;">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><!--v-if--><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2020" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2020</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2021" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2021</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2022" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2022</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2023" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2023</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available today" aria-selected="true" aria-label="2024" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2024</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2025" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2025</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2026" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2026</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2027" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2027</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2028" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2028</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2029" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2029</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--></div></div></div><div class="el-picker-panel__footer"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style="display:none;"><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2007;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header el-date-picker__header--bordered"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label active" style="display:none;">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><!--v-if--><!--v-if--><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="today" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2008;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header el-date-picker__header--bordered"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label active" style="display:none;">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><!--v-if--><!--v-if--><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="today" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><div class="el-picker-panel__footer"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style="display:none;"><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2009;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" actualvisible="false" format="YYYY-MM-DD"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left" aria-label="Previous Year"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-left" aria-label="Previous Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><!--v-if--><!--v-if--><div>2024  October</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><!--v-if--><!--v-if--><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-right" aria-label="Next Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><div>2024  November</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><!--v-if--></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2010;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker has-sidebar" actualvisible="false" format="YYYY-MM-DD"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><div class="el-picker-panel__sidebar"><!--[--><button type="button" class="el-picker-panel__shortcut">Last week</button><button type="button" class="el-picker-panel__shortcut">Last month</button><button type="button" class="el-picker-panel__shortcut">Last 3 months</button><!--]--></div><div class="el-picker-panel__body"><!--v-if--><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left" aria-label="Previous Year"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-left" aria-label="Previous Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-right" aria-label="Next Year"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled arrow-right" aria-label="Next Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><div>2024  October</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-left" aria-label="Previous Year"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled arrow-left" aria-label="Previous Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-right" aria-label="Next Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><div>2024  November</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><!--v-if--></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2011;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" visible="false" actualvisible="false" format="YYYY-MM" type="monthrange"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><!--v-if--><div>2024 </div></div><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="today" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><!--v-if--><button type="button" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><div>2025 </div></div><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2012;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker has-sidebar" visible="false" actualvisible="false" format="YYYY-MM" type="monthrange"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><div class="el-picker-panel__sidebar"><!--[--><button type="button" class="el-picker-panel__shortcut">This month</button><button type="button" class="el-picker-panel__shortcut">This year</button><button type="button" class="el-picker-panel__shortcut">Last 6 months</button><!--]--></div><div class="el-picker-panel__body"><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><div>2024 </div></div><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="today" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><div>2025 </div></div><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2013;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" visible="false" actualvisible="false" format="YYYY" type="yearrange"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><!--v-if--><div>2020-2029</div></div><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2020" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2020</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2021" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2021</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2022" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2022</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2023" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2023</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available today" aria-selected="true" aria-label="2024" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2024</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2025" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2025</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2026" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2026</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2027" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2027</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2028" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2028</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2029" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2029</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><!--v-if--><button type="button" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><div>2030-2039</div></div><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2030" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2030</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2031" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2031</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2032" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2032</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2033" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2033</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="true" aria-label="2034" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2034</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2035" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2035</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2036" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2036</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2037" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2037</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2038" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2038</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2039" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2039</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2014;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker has-sidebar" visible="false" actualvisible="false" format="YYYY" type="yearrange"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><div class="el-picker-panel__sidebar"><!--[--><button type="button" class="el-picker-panel__shortcut">This Year</button><button type="button" class="el-picker-panel__shortcut">Last 10 years</button><button type="button" class="el-picker-panel__shortcut">Next 50 years</button><!--]--></div><div class="el-picker-panel__body"><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><div>2020-2029</div></div><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2020" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2020</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2021" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2021</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2022" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2022</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2023" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2023</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available today" aria-selected="true" aria-label="2024" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2024</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2025" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2025</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2026" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2026</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2027" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2027</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2028" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2028</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2029" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2029</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><div>2030-2039</div></div><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2030" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2030</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2031" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2031</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2032" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2032</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2033" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2033</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="true" aria-label="2034" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2034</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2035" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2035</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2036" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2036</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2037" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2037</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2038" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2038</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2039" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2039</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2015;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2010 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2016;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" actualvisible="false" format="YYYY-MM-DD"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left" aria-label="Previous Year"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-left" aria-label="Previous Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><!--v-if--><!--v-if--><div>2010  October</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><!--v-if--><!--v-if--><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-right" aria-label="Next Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><div>2010  November</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><!--v-if--></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2017;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2018;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2019;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2020;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" actualvisible="false" format="YYYY-MM-DD"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left" aria-label="Previous Year"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-left" aria-label="Previous Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><!--v-if--><!--v-if--><div>2024  October</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><!--v-if--><!--v-if--><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-right" aria-label="Next Month"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><div>2024  November</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><!--v-if--></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2021;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2022;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2021 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>26</span><!----></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>27</span><!----></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>28</span><!----></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>29</span><!----></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>30</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>1</span><span class="holiday" data-v-b3e89688></span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>2</span><span class="holiday" data-v-b3e89688></span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>3</span><span class="holiday" data-v-b3e89688></span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>4</span><span class="holiday" data-v-b3e89688></span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>5</span><span class="holiday" data-v-b3e89688></span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>6</span><span class="holiday" data-v-b3e89688></span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>7</span><span class="holiday" data-v-b3e89688></span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>8</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>9</span><!----></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>10</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>11</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>12</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>13</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>14</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>15</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>16</span><!----></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>17</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>18</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>19</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>20</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>21</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>22</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>23</span><!----></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>24</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>25</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>26</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>27</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>28</span><!----></div><!--]--></td><td class="available current" aria-current="date" aria-selected="true" tabindex="0"><!--[--><div class="cell current" data-v-b3e89688><span class="text" data-v-b3e89688>29</span><!----></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>30</span><!----></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>31</span><!----></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>1</span><!----></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>2</span><!----></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>3</span><!----></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>4</span><!----></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>5</span><!----></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="cell" data-v-b3e89688><span class="text" data-v-b3e89688>6</span><!----></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2023;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header el-date-picker__header--bordered"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label active" style="display:none;">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><!--v-if--><!--v-if--><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>1期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>3期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>4期</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>5期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>6期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>7期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>8期</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>9期</span></div><!--]--></td><td class="today" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>10期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>11期</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>12期</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2024;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header el-date-picker__header--bordered"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M529.408 149.376a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L259.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L197.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224zm256 0a29.12 29.12 0 0 1 41.728 0 30.592 30.592 0 0 1 0 42.688L515.264 511.936l311.872 319.936a30.592 30.592 0 0 1-.512 43.264 29.12 29.12 0 0 1-41.216-.512L453.76 534.272a32 32 0 0 1 0-44.672l331.648-340.224z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2020 - 2029</span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label" style="display:none;">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right" style="display:none;"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M452.864 149.312a29.12 29.12 0 0 1 41.728.064L826.24 489.664a32 32 0 0 1 0 44.672L494.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L764.736 512 452.864 192a30.592 30.592 0 0 1 0-42.688m-256 0a29.12 29.12 0 0 1 41.728.064L570.24 489.664a32 32 0 0 1 0 44.672L238.592 874.624a29.12 29.12 0 0 1-41.728 0 30.592 30.592 0 0 1 0-42.752L508.736 512 196.864 192a30.592 30.592 0 0 1 0-42.688z"></path></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><!--v-if--><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2020" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2021y</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2021" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2022y</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2022" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2023y</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2023" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2024y</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available today" aria-selected="true" aria-label="2024" tabindex="0"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2025y</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2025" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2026y</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2026" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2027y</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2027" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2028y</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2028" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2029y</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2029" tabindex="-1"><!--[--><div class="el-date-table-cell" data-v-b3e89688><span class="el-date-table-cell__text" data-v-b3e89688>2030y</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><div style="z-index:2025;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-picker" actualvisible="false" unlinkpanels="false"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-date-picker__header"><span class="el-date-picker__prev-btn"><button type="button" aria-label="Previous Year" class="d-arrow-left el-picker-panel__icon-btn"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><button type="button" aria-label="Previous Month" class="el-picker-panel__icon-btn arrow-left"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-efbf19cd><path fill="currentColor" d="M672 192 288 511.936 672 832z"></path></svg><!--]--></i><!--]--></button></span><span role="button" class="el-date-picker__header-label" aria-live="polite" tabindex="0">2024 </span><span role="button" aria-live="polite" tabindex="0" class="el-date-picker__header-label">October</span><span class="el-date-picker__next-btn"><button type="button" aria-label="Next Month" class="el-picker-panel__icon-btn arrow-right"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-efbf19cd><path fill="currentColor" d="M384 192v640l384-320.064z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button></span></div><div class="el-picker-panel__content"><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table><!--v-if--><!--v-if--></div></div></div><div class="el-picker-panel__footer" style="display:none;"><button ariadisabled="false" type="button" class="el-button el-button--small is-text el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->Now<!--]--></span></button><button ariadisabled="false" type="button" class="el-button el-button--small is-plain el-picker-panel__link-btn" style=""><!--v-if--><span class=""><!--[-->OK<!--]--></span></button></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2026;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" actualvisible="false" format="YYYY/MM/DD"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><!--v-if--><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left" aria-label="Previous Year"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-left" aria-label="Previous Month"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-efbf19cd><path fill="currentColor" d="M672 192 288 511.936 672 832z"></path></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-right" aria-label="Next Year"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled arrow-right" aria-label="Next Month"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-efbf19cd><path fill="currentColor" d="M384 192v640l384-320.064z"></path></svg><!--]--></i><!--]--></button><div>2024  October</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available today" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-left" aria-label="Previous Year"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled arrow-left" aria-label="Previous Month"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-efbf19cd><path fill="currentColor" d="M672 192 288 511.936 672 832z"></path></svg><!--]--></i><!--]--></button><button type="button" aria-label="Next Year" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn arrow-right" aria-label="Next Month"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-efbf19cd><path fill="currentColor" d="M384 192v640l384-320.064z"></path></svg><!--]--></i><!--]--></button><div>2024  November</div></div><table aria-label="Use the arrow keys and enter to select the day of the month" class="el-date-table" cellspacing="0" cellpadding="0" role="grid"><tbody><tr><!--v-if--><!--[--><th aria-label="Sunday" scope="col">Sun</th><th aria-label="Monday" scope="col">Mon</th><th aria-label="Tuesday" scope="col">Tue</th><th aria-label="Wednesday" scope="col">Wed</th><th aria-label="Thursday" scope="col">Thu</th><th aria-label="Friday" scope="col">Fri</th><th aria-label="Saturday" scope="col">Sat</th><!--]--></tr><!--[--><tr class="el-date-table__row"><!--[--><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><td class="prev-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">31</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">8</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">9</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">10</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">11</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">12</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">13</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">14</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">15</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">16</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">17</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">18</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">19</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">20</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">21</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">22</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">23</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">24</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">25</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">26</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">27</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">28</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">29</span></div><!--]--></td><td class="available" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">30</span></div><!--]--></td><!--]--></tr><tr class="el-date-table__row"><!--[--><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">1</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">3</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">4</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">5</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">6</span></div><!--]--></td><td class="next-month" aria-selected="false" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">7</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div><!--v-if--></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2027;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" visible="false" actualvisible="false" format="YYYY/MM/DD" type="monthrange"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-right"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><div>2024 </div></div><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="today" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><button type="button" disabled class="el-picker-panel__icon-btn is-disabled d-arrow-left"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><button type="button" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><div>2025 </div></div><table role="grid" aria-label="Use the arrow keys and enter to select the month" class="el-month-table"><tbody><!--[--><tr><!--[--><td class="" aria-selected="false" aria-label="January" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jan</span></div><!--]--></td><td class="" aria-selected="false" aria-label="February" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Feb</span></div><!--]--></td><td class="" aria-selected="false" aria-label="March" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Mar</span></div><!--]--></td><td class="" aria-selected="false" aria-label="April" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Apr</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="May" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">May</span></div><!--]--></td><td class="" aria-selected="false" aria-label="June" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jun</span></div><!--]--></td><td class="" aria-selected="false" aria-label="July" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Jul</span></div><!--]--></td><td class="" aria-selected="false" aria-label="August" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Aug</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="" aria-selected="false" aria-label="September" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Sep</span></div><!--]--></td><td class="" aria-selected="true" aria-label="October" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Oct</span></div><!--]--></td><td class="" aria-selected="false" aria-label="November" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Nov</span></div><!--]--></td><td class="" aria-selected="false" aria-label="December" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">Dec</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><div style="z-index:2028;position:absolute;left:0;top:0;display:none;" class="el-popper is-pure is-light el-picker__popper" tabindex="-1" aria-hidden="true"><!--[--><!--[--><!--[--><!--[--><!--[--><div class="el-picker-panel el-date-range-picker" visible="false" actualvisible="false" format="YYYY" type="yearrange"><div class="el-picker-panel__body-wrapper"><!--[--><!--]--><!--v-if--><div class="el-picker-panel__body"><div class="el-picker-panel__content el-date-range-picker__content is-left"><div class="el-date-range-picker__header"><button type="button" class="el-picker-panel__icon-btn d-arrow-left"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><!--v-if--><div>2020-2029</div></div><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2020" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2020</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2021" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2021</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2022" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2022</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2023" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2023</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available today" aria-selected="true" aria-label="2024" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2024</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2025" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2025</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2026" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2026</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2027" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2027</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2028" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2028</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2029" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2029</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div><div class="el-picker-panel__content el-date-range-picker__content is-right"><div class="el-date-range-picker__header"><!--v-if--><button type="button" class="el-picker-panel__icon-btn d-arrow-right"><!--[--><i class="el-icon" style="" data-v-efbf19cd><!--[--><svg viewbox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" data-v-efbf19cd><g stroke-width="1" fill-rule="evenodd" data-v-efbf19cd><g fill="currentColor" data-v-efbf19cd><path d="M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z" data-v-efbf19cd></path></g></g></svg><!--]--></i><!--]--></button><div>2030-2039</div></div><table role="grid" aria-label="Use the arrow keys and enter to select the year" class="el-year-table"><tbody><!--[--><tr><!--[--><td class="available" aria-selected="false" aria-label="2030" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2030</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2031" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2031</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2032" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2032</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2033" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2033</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="true" aria-label="2034" tabindex="0"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2034</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2035" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2035</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2036" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2036</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2037" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2037</span></div><!--]--></td><!--]--></tr><tr><!--[--><td class="available" aria-selected="false" aria-label="2038" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2038</span></div><!--]--></td><td class="available" aria-selected="false" aria-label="2039" tabindex="-1"><!--[--><div class="el-date-table-cell"><span class="el-date-table-cell__text">2039</span></div><!--]--></td><!--]--></tr><!--]--></tbody></table></div></div></div></div><!--]--><!--]--><span class="el-popper__arrow" style="position:absolute;" data-popper-arrow></span><!--]--><!--]--><!--]--></div><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--><!--[--><!--v-if--><!--]--><!--teleport anchor--></div>
    <div id="app"><div class="App"><!--[--><span tabindex="-1" data-v-63b82da6></span><a href="#page-content" class="skip-link visually-hidden" data-v-63b82da6>Skip to content</a><!--]--><!----><header class="navbar has-sidebar"><div class="navbar-wrapper" data-v-5278b8c5><div class="header-container" data-v-5278b8c5><div class="logo-container" data-v-5278b8c5><a href="/en-US/" data-v-5278b8c5><img class="logo" src="/images/element-plus-logo.svg" alt="Element Plus Logo" data-v-5278b8c5></a></div><div class="content" data-v-5278b8c5><div id="docsearch" class="algolia-search-box search" data-v-5278b8c5></div><nav class="navbar-menu menu" data-v-5278b8c5><!--[--><a class="link-item link is-menu-link" href="/en-US/guide/design" data-v-afd7792a data-v-d0bc45d6><!--[--><!--[-->Guide<!--]--><!--]--><!----></a><a class="link-item link is-menu-link active" href="/en-US/component/overview" data-v-afd7792a data-v-d0bc45d6><!--[--><!--[-->Component<!--]--><!--]--><!----></a><a class="link-item link is-menu-link" href="/en-US/resource/index" data-v-afd7792a data-v-d0bc45d6><!--[--><!--[-->Resource<!--]--><!--]--><!----></a><!--]--></nav><div class="theme-toggler-content theme-toggler" data-v-5278b8c5 data-v-02ddc817><!----></div><div class="translation-container translation" data-v-5278b8c5 data-v-f414ea64><!----></div><div class="social-links" data-v-5278b8c5 data-v-0fbe8527><!--[--><a href="https://github.com/element-plus/element-plus" title="GitHub" target="_blank" rel="noreferrer noopener" class="social-link" data-v-0fbe8527 data-v-87052479><i class="el-icon" style="font-size:24px;" data-v-87052479><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-87052479><path fill="currentColor" d="M12 2C6.475 2 2 6.475 2 12a9.994 9.994 0 0 0 6.838 9.488c.5.087.687-.213.687-.476c0-.237-.013-1.024-.013-1.862c-2.512.463-3.162-.612-3.362-1.175c-.113-.288-.6-1.175-1.025-1.413c-.35-.187-.85-.65-.013-.662c.788-.013 1.35.725 1.538 1.025c.9 1.512 2.338 1.087 2.912.825c.088-.65.35-1.087.638-1.337c-2.225-.25-4.55-1.113-4.55-4.938c0-1.088.387-1.987 1.025-2.688c-.1-.25-.45-1.275.1-2.65c0 0 .837-.262 2.75 1.026a9.28 9.28 0 0 1 2.5-.338c.85 0 1.7.112 2.5.337c1.912-1.3 2.75-1.024 2.75-1.024c.55 1.375.2 2.4.1 2.65c.637.7 1.025 1.587 1.025 2.687c0 3.838-2.337 4.688-4.562 4.938c.362.312.675.912.675 1.85c0 1.337-.013 2.412-.013 2.75c0 .262.188.574.688.474A10.016 10.016 0 0 0 22 12c0-5.525-4.475-10-10-10z"></path></svg><!--]--></i></a><!--]--></div><button class="reset-btn menu-hamburger hamburger" aria-label="mobile navigation" aria-expanded="false" aria-controls="full-screen" data-v-5278b8c5><span class="hamburger-1"></span><span class="hamburger-2"></span><span class="hamburger-3"></span></button></div></div></div><!----></header><div class="sub-nav py-3 flex items-center"><button class="reset-btn sidebar-button flex items-center" aria-expanded="false"><i class="el-icon mr-2" style="font-size:20px;"><!--[--><svg width="20" height="20" viewbox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><rect x="2" y="7" width="11" height="2" fill="#606266"></rect><rect x="2" y="11" width="14" height="2" fill="#606266"></rect><rect x="2" y="15" width="8" height="2" fill="#606266"></rect><rect x="2" y="3" width="16" height="2" fill="#606266"></rect></svg><!--]--></i><span class="leading-6">Menu</span></button><button ariadisabled="false" type="button" class="el-button is-link go-back-top height-5" style=""><!--v-if--><span class=""><!--[--> Back to top <!--]--></span></button></div><div class="el-scrollbar sidebar"><div class="el-scrollbar__wrap el-scrollbar__wrap--hidden-default" style=""><div class="el-scrollbar__view" style=""><!--[--><aside><!--[--><div class="page-sidebar-row" data-v-02779303><p class="title" data-v-02779303>Sponsored by</p><div data-v-02779303 data-v-faed0b94><!--[--><a href="https://melecode.com/" title="美乐 - 企业级全栈低代码开发平台" class="sponsor-item inline-flex" style="" target="_blank" data-v-faed0b94><img src="/images/sponsors/mele-banner.png" alt="美乐" data-v-faed0b94></a><a href="https://vform666.com/" title="VForm - Vue 2/3 可视化低代码表单" class="sponsor-item inline-flex" style="" target="_blank" data-v-faed0b94><img src="/images/sponsors/vform-banner.png" alt="VForm" data-v-faed0b94></a><a href="https://www.jnpfsoft.com/index.html?from=elementUI" title="JNPF - JNPF 低代码开发平台，让开发变得简单！" class="sponsor-item inline-flex" style="" target="_blank" data-v-faed0b94><img src="/images/sponsors/jnpfsoft.jpg" alt="JNPF" data-v-faed0b94></a><!--]--></div><div data-v-02779303 data-v-0a7a34f6><!--[--><!--]--></div></div><!--]--><div class="sidebar-groups"><!--[--><section class="sidebar-group"><p class="sidebar-group__title">Overview</p><!--[--><a class="link" href="/en-US/component/overview" data-v-54799624><p class="link-text" data-v-54799624>Overview</p><!----></a><!--]--></section><section class="sidebar-group"><p class="sidebar-group__title">Basic</p><!--[--><a class="link" href="/en-US/component/button" data-v-54799624><p class="link-text" data-v-54799624>Button</p><!----></a><a class="link" href="/en-US/component/border" data-v-54799624><p class="link-text" data-v-54799624>Border</p><!----></a><a class="link" href="/en-US/component/color" data-v-54799624><p class="link-text" data-v-54799624>Color</p><!----></a><a class="link" href="/en-US/component/container" data-v-54799624><p class="link-text" data-v-54799624>Layout Container</p><!----></a><a class="link" href="/en-US/component/icon" data-v-54799624><p class="link-text" data-v-54799624>Icon</p><!----></a><a class="link" href="/en-US/component/layout" data-v-54799624><p class="link-text" data-v-54799624>Layout</p><!----></a><a class="link" href="/en-US/component/link" data-v-54799624><p class="link-text" data-v-54799624>Link</p><!----></a><a class="link flex items-center" href="/en-US/component/text" data-v-54799624><p class="link-text" data-v-54799624>Text</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.3.0<!--]--></span><!--v-if--></span></a><a class="link" href="/en-US/component/scrollbar" data-v-54799624><p class="link-text" data-v-54799624>Scrollbar</p><!----></a><a class="link" href="/en-US/component/space" data-v-54799624><p class="link-text" data-v-54799624>Space</p><!----></a><a class="link" href="/en-US/component/typography" data-v-54799624><p class="link-text" data-v-54799624>Typography</p><!----></a><!--]--></section><section class="sidebar-group"><p class="sidebar-group__title">Configuration</p><!--[--><a class="link" href="/en-US/component/config-provider" data-v-54799624><p class="link-text" data-v-54799624>Config Provider</p><!----></a><!--]--></section><section class="sidebar-group"><p class="sidebar-group__title">Form</p><!--[--><a class="link" href="/en-US/component/autocomplete" data-v-54799624><p class="link-text" data-v-54799624>Autocomplete</p><!----></a><a class="link" href="/en-US/component/cascader" data-v-54799624><p class="link-text" data-v-54799624>Cascader</p><!----></a><a class="link" href="/en-US/component/checkbox" data-v-54799624><p class="link-text" data-v-54799624>Checkbox</p><!----></a><a class="link" href="/en-US/component/color-picker" data-v-54799624><p class="link-text" data-v-54799624>Color Picker</p><!----></a><a class="link active" href="/en-US/component/date-picker" data-v-54799624><p class="link-text" data-v-54799624>Date Picker</p><!----></a><a class="link" href="/en-US/component/datetime-picker" data-v-54799624><p class="link-text" data-v-54799624>DateTime Picker</p><!----></a><a class="link" href="/en-US/component/form" data-v-54799624><p class="link-text" data-v-54799624>Form</p><!----></a><a class="link" href="/en-US/component/input" data-v-54799624><p class="link-text" data-v-54799624>Input</p><!----></a><a class="link" href="/en-US/component/input-number" data-v-54799624><p class="link-text" data-v-54799624>Input Number</p><!----></a><a class="link flex items-center" href="/en-US/component/mention" data-v-54799624><p class="link-text" data-v-54799624>Mention</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.8.0<!--]--></span><!--v-if--></span></a><a class="link" href="/en-US/component/radio" data-v-54799624><p class="link-text" data-v-54799624>Radio</p><!----></a><a class="link" href="/en-US/component/rate" data-v-54799624><p class="link-text" data-v-54799624>Rate</p><!----></a><a class="link" href="/en-US/component/select" data-v-54799624><p class="link-text" data-v-54799624>Select</p><!----></a><a class="link" href="/en-US/component/select-v2" data-v-54799624><p class="link-text" data-v-54799624>Virtualized Select</p><!----></a><a class="link" href="/en-US/component/slider" data-v-54799624><p class="link-text" data-v-54799624>Slider</p><!----></a><a class="link" href="/en-US/component/switch" data-v-54799624><p class="link-text" data-v-54799624>Switch</p><!----></a><a class="link" href="/en-US/component/time-picker" data-v-54799624><p class="link-text" data-v-54799624>Time Picker</p><!----></a><a class="link" href="/en-US/component/time-select" data-v-54799624><p class="link-text" data-v-54799624>Time Select</p><!----></a><a class="link" href="/en-US/component/transfer" data-v-54799624><p class="link-text" data-v-54799624>Transfer</p><!----></a><a class="link flex items-center" href="/en-US/component/tree-select" data-v-54799624><p class="link-text" data-v-54799624>TreeSelect</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.1.8<!--]--></span><!--v-if--></span></a><a class="link" href="/en-US/component/upload" data-v-54799624><p class="link-text" data-v-54799624>Upload</p><!----></a><!--]--></section><section class="sidebar-group"><p class="sidebar-group__title">Data</p><!--[--><a class="link" href="/en-US/component/avatar" data-v-54799624><p class="link-text" data-v-54799624>Avatar</p><!----></a><a class="link" href="/en-US/component/badge" data-v-54799624><p class="link-text" data-v-54799624>Badge</p><!----></a><a class="link" href="/en-US/component/calendar" data-v-54799624><p class="link-text" data-v-54799624>Calendar</p><!----></a><a class="link" href="/en-US/component/card" data-v-54799624><p class="link-text" data-v-54799624>Card</p><!----></a><a class="link" href="/en-US/component/carousel" data-v-54799624><p class="link-text" data-v-54799624>Carousel</p><!----></a><a class="link" href="/en-US/component/collapse" data-v-54799624><p class="link-text" data-v-54799624>Collapse</p><!----></a><a class="link" href="/en-US/component/descriptions" data-v-54799624><p class="link-text" data-v-54799624>Descriptions</p><!----></a><a class="link" href="/en-US/component/empty" data-v-54799624><p class="link-text" data-v-54799624>Empty</p><!----></a><a class="link" href="/en-US/component/image" data-v-54799624><p class="link-text" data-v-54799624>Image</p><!----></a><a class="link" href="/en-US/component/infinite-scroll" data-v-54799624><p class="link-text" data-v-54799624>Infinite Scroll</p><!----></a><a class="link" href="/en-US/component/pagination" data-v-54799624><p class="link-text" data-v-54799624>Pagination</p><!----></a><a class="link" href="/en-US/component/progress" data-v-54799624><p class="link-text" data-v-54799624>Progress</p><!----></a><a class="link" href="/en-US/component/result" data-v-54799624><p class="link-text" data-v-54799624>Result</p><!----></a><a class="link" href="/en-US/component/skeleton" data-v-54799624><p class="link-text" data-v-54799624>Skeleton</p><!----></a><a class="link" href="/en-US/component/table" data-v-54799624><p class="link-text" data-v-54799624>Table</p><!----></a><a class="link flex items-center" href="/en-US/component/table-v2" data-v-54799624><p class="link-text" data-v-54799624>Virtualized Table</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.2.0<!--]--></span><!--v-if--></span></a><a class="link" href="/en-US/component/tag" data-v-54799624><p class="link-text" data-v-54799624>Tag</p><!----></a><a class="link" href="/en-US/component/timeline" data-v-54799624><p class="link-text" data-v-54799624>Timeline</p><!----></a><a class="link flex items-center" href="/en-US/component/tour" data-v-54799624><p class="link-text" data-v-54799624>Tour</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.5.0<!--]--></span><!--v-if--></span></a><a class="link" href="/en-US/component/tree" data-v-54799624><p class="link-text" data-v-54799624>Tree</p><!----></a><a class="link" href="/en-US/component/tree-v2" data-v-54799624><p class="link-text" data-v-54799624>Virtualized Tree</p><!----></a><a class="link flex items-center" href="/en-US/component/statistic" data-v-54799624><p class="link-text" data-v-54799624>Statistic</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.2.30<!--]--></span><!--v-if--></span></a><a class="link flex items-center" href="/en-US/component/segmented" data-v-54799624><p class="link-text" data-v-54799624>Segmented</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.7.0<!--]--></span><!--v-if--></span></a><!--]--></section><section class="sidebar-group"><p class="sidebar-group__title">Navigation</p><!--[--><a class="link" href="/en-US/component/affix" data-v-54799624><p class="link-text" data-v-54799624>Affix</p><!----></a><a class="link flex items-center" href="/en-US/component/anchor" data-v-54799624><p class="link-text" data-v-54799624>Anchor</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.6.0<!--]--></span><!--v-if--></span></a><a class="link" href="/en-US/component/backtop" data-v-54799624><p class="link-text" data-v-54799624>Backtop</p><!----></a><a class="link" href="/en-US/component/breadcrumb" data-v-54799624><p class="link-text" data-v-54799624>Breadcrumb</p><!----></a><a class="link" href="/en-US/component/dropdown" data-v-54799624><p class="link-text" data-v-54799624>Dropdown</p><!----></a><a class="link" href="/en-US/component/menu" data-v-54799624><p class="link-text" data-v-54799624>Menu</p><!----></a><a class="link" href="/en-US/component/page-header" data-v-54799624><p class="link-text" data-v-54799624>Page Header</p><!----></a><a class="link" href="/en-US/component/steps" data-v-54799624><p class="link-text" data-v-54799624>Steps</p><!----></a><a class="link" href="/en-US/component/tabs" data-v-54799624><p class="link-text" data-v-54799624>Tabs</p><!----></a><!--]--></section><section class="sidebar-group"><p class="sidebar-group__title">Feedback</p><!--[--><a class="link" href="/en-US/component/alert" data-v-54799624><p class="link-text" data-v-54799624>Alert</p><!----></a><a class="link" href="/en-US/component/dialog" data-v-54799624><p class="link-text" data-v-54799624>Dialog</p><!----></a><a class="link" href="/en-US/component/drawer" data-v-54799624><p class="link-text" data-v-54799624>Drawer</p><!----></a><a class="link" href="/en-US/component/loading" data-v-54799624><p class="link-text" data-v-54799624>Loading</p><!----></a><a class="link" href="/en-US/component/message" data-v-54799624><p class="link-text" data-v-54799624>Message</p><!----></a><a class="link" href="/en-US/component/message-box" data-v-54799624><p class="link-text" data-v-54799624>Message Box</p><!----></a><a class="link" href="/en-US/component/notification" data-v-54799624><p class="link-text" data-v-54799624>Notification</p><!----></a><a class="link" href="/en-US/component/popconfirm" data-v-54799624><p class="link-text" data-v-54799624>Popconfirm</p><!----></a><a class="link" href="/en-US/component/popover" data-v-54799624><p class="link-text" data-v-54799624>Popover</p><!----></a><a class="link" href="/en-US/component/tooltip" data-v-54799624><p class="link-text" data-v-54799624>Tooltip</p><!----></a><!--]--></section><section class="sidebar-group"><p class="sidebar-group__title">Others</p><!--[--><a class="link" href="/en-US/component/divider" data-v-54799624><p class="link-text" data-v-54799624>Divider</p><!----></a><a class="link flex items-center" href="/en-US/component/watermark" data-v-54799624><p class="link-text" data-v-54799624>Watermark</p><span class="el-tag el-tag--primary el-tag--small el-tag--plain is-hit is-round ml-2" style="" data-v-54799624><span class="el-tag__content"><!--[-->2.4.0<!--]--></span><!--v-if--></span></a><!--]--></section><!--]--></div><!--[--><!--]--></aside><!--]--></div></div><!--[--><div class="el-scrollbar__bar is-horizontal" style="display:none;"><div class="el-scrollbar__thumb" style="width:;transform:translateX(0%);"></div></div><div class="el-scrollbar__bar is-vertical" style="display:none;"><div class="el-scrollbar__thumb" style="height:;transform:translateY(0%);"></div></div><!--]--></div><main id="page-content" class="page-content has-sidebar"><div class="doc-content-wrapper"><div class="doc-content-container"><div style="position:relative;" class="doc-content"><div><h1 id="datepicker" tabindex="-1">DatePicker <a class="header-anchor vp-link" href="#datepicker" aria-label="Permalink to &quot;DatePicker&quot;">​</a></h1><p>Use Date Picker for date input.</p><h2 id="enter-date" tabindex="-1">Enter Date <a class="header-anchor vp-link" href="#enter-date" aria-label="Permalink to &quot;Enter Date&quot;">​</a></h2><p>Basic date picker measured by &#39;day&#39;.</p><!--[--><div text="sm" m="y-4" data-v-72294632><p>The measurement is determined by the <code>type</code> attribute. You can enable quick options via <code>shortcuts</code> property. The disabled date is set by <code>disabledDate</code>, which is a function.</p>
</div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><!--[--><div class="el-radio-group" role="radiogroup" aria-label="size control" data-v-d5011e97><!--[--><label class="el-radio-button" data-v-d5011e97><input class="el-radio-button__original-radio" value="large" type="radio" name="el-id-1024-0"><span class="el-radio-button__inner" style=""><!--[-->large<!--]--></span></label><label class="el-radio-button is-active" data-v-d5011e97><input class="el-radio-button__original-radio" value="default" type="radio" name="el-id-1024-0" checked><span class="el-radio-button__inner" style="background-color:;border-color:;box-shadow:;color:;"><!--[-->default<!--]--></span></label><label class="el-radio-button" data-v-d5011e97><input class="el-radio-button__original-radio" value="small" type="radio" name="el-id-1024-0"><span class="el-radio-button__inner" style=""><!--[-->small<!--]--></span></label><!--]--></div><div class="demo-date-picker" data-v-d5011e97><div class="block" data-v-d5011e97><span class="demonstration" data-v-d5011e97>Default</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--default el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-1" type="text" autocomplete="off" tabindex="0" placeholder="Pick a day" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-d5011e97><span class="demonstration" data-v-d5011e97>Picker with quick options</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--default el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-2" type="text" autocomplete="off" tabindex="0" placeholder="Pick a day" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/enter-date.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-group</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">size</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> aria-label</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"size control"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"large"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>large&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"default"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>default&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"small"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>small&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-group</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Default&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a day"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">size</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Picker with quick options&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a day"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">disabled-date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">disabledDate</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">shortcuts</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">shortcuts</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">size</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> size</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'default'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'large'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'small'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'default'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> shortcuts</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Today'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    value: </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(),</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Yesterday'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> date</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      date.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(date.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 3600</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1000</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 24</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> date</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'A week ago'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> date</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      date.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(date.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 3600</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1000</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 7</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> date</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">]</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> disabledDate</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> (</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">time</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> time.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> Date.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">now</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="other-measurements" tabindex="-1">Other measurements <a class="header-anchor vp-link" href="#other-measurements" aria-label="Permalink to &quot;Other measurements&quot;">​</a></h2><p>You can choose week, month, year or multiple dates by extending the standard date picker component.</p><!--[--><div text="sm" m="y-4" data-v-72294632></div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-0d543bb4><div class="container" data-v-0d543bb4><div class="block" data-v-0d543bb4><span class="demonstration" data-v-0d543bb4>Week</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--week el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-7" type="text" readonly autocomplete="off" tabindex="0" placeholder="Pick a week" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-0d543bb4><span class="demonstration" data-v-0d543bb4>Dates</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--dates el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-8" type="text" readonly autocomplete="off" tabindex="0" placeholder="Pick one or more dates" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div></div><div class="container" data-v-0d543bb4><div class="block" data-v-0d543bb4><span class="demonstration" data-v-0d543bb4>Year</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--year el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-9" type="text" autocomplete="off" tabindex="0" placeholder="Pick a year" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-0d543bb4><span class="demonstration" data-v-0d543bb4>Years</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--years el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-10" type="text" readonly autocomplete="off" tabindex="0" placeholder="Pick one or more years" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div></div><div class="container" data-v-0d543bb4><div class="block" data-v-0d543bb4><span class="demonstration" data-v-0d543bb4>Month</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--month el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-11" type="text" autocomplete="off" tabindex="0" placeholder="Pick a month" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-0d543bb4><span class="demonstration" data-v-0d543bb4>Months</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--months el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-12" type="text" readonly autocomplete="off" tabindex="0" placeholder="Pick one or more months" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/other-measurements.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"container"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Week&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"week"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"[Week] ww"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a week"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Dates&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"dates"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick one or more dates"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"container"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Year&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value3</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"year"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a year"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Years&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value4</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"years"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick one or more years"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"container"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Month&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value5</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"month"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a month"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Months&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value6</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"months"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick one or more months"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value3</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value4</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value5</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value6</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-top</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="date-range" tabindex="-1">Date Range <a class="header-anchor vp-link" href="#date-range" aria-label="Permalink to &quot;Date Range&quot;">​</a></h2><p>Picking a date range is supported.</p><!--[--><div text="sm" m="y-4" data-v-72294632><p>When in range mode, the left and right panels are linked by default. If you want the two panels to switch current months independently, you can use the <code>unlink-panels</code> attribute.</p>
</div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><!--[--><div class="el-radio-group" role="radiogroup" aria-label="size control" data-v-4bf9908d><!--[--><label class="el-radio-button" data-v-4bf9908d><input class="el-radio-button__original-radio" value="large" type="radio" name="el-id-1024-17"><span class="el-radio-button__inner" style=""><!--[-->large<!--]--></span></label><label class="el-radio-button is-active" data-v-4bf9908d><input class="el-radio-button__original-radio" value="default" type="radio" name="el-id-1024-17" checked><span class="el-radio-button__inner" style="background-color:;border-color:;box-shadow:;color:;"><!--[-->default<!--]--></span></label><label class="el-radio-button" data-v-4bf9908d><input class="el-radio-button__original-radio" value="small" type="radio" name="el-id-1024-17"><span class="el-radio-button__inner" style=""><!--[-->small<!--]--></span></label><!--]--></div><div class="demo-date-picker" data-v-4bf9908d><div class="block" data-v-4bf9908d><span class="demonstration" data-v-4bf9908d>Default</span><!--[--><div class="el-date-editor el-date-editor--daterange el-input__wrapper el-range-editor el-range-editor--default el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-18" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start date" value class="el-range-input"><!--[--><span class="el-range-separator">To</span><!--]--><input autocomplete="off" name placeholder="End date" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-4bf9908d><span class="demonstration" data-v-4bf9908d>With quick options</span><!--[--><div class="el-date-editor el-date-editor--daterange el-input__wrapper el-range-editor el-range-editor--default el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-19" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start date" value class="el-range-input"><!--[--><span class="el-range-separator">To</span><!--]--><input autocomplete="off" name placeholder="End date" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/date-range.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-group</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">size</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> aria-label</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"size control"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"large"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>large&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"default"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>default&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"small"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>small&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-button</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-radio-group</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Default&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"daterange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        range-separator</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"To"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End date"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">size</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>With quick options&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"daterange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        unlink-panels</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        range-separator</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"To"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End date"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">shortcuts</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">shortcuts</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">size</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> size</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'default'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'large'</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'small'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'default'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> shortcuts</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Last week'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 3600</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1000</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 7</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [start, end]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Last month'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 3600</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1000</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 30</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [start, end]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Last 3 months'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getTime</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 3600</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1000</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> *</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 90</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [start, end]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="month-range" tabindex="-1">Month Range <a class="header-anchor vp-link" href="#month-range" aria-label="Permalink to &quot;Month Range&quot;">​</a></h2><p>Picking a month range is supported.</p><!--[--><div text="sm" m="y-4" data-v-72294632><p>When in range mode, the left and right panels are linked by default. If you want the two panels to switch current years independently, you can use the <code>unlink-panels</code> attribute.</p>
</div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-dec82273><div class="block" data-v-dec82273><span class="demonstration" data-v-dec82273>Default</span><!--[--><div class="el-date-editor el-date-editor--monthrange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-24" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start month" value class="el-range-input"><!--[--><span class="el-range-separator">To</span><!--]--><input autocomplete="off" name placeholder="End month" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-dec82273><span class="demonstration" data-v-dec82273>With quick options</span><!--[--><div class="el-date-editor el-date-editor--monthrange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-25" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start month" value class="el-range-input"><!--[--><span class="el-range-separator">To</span><!--]--><input autocomplete="off" name placeholder="End month" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/month-range.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Default&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"monthrange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        range-separator</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"To"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start month"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End month"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>With quick options&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"monthrange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        unlink-panels</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        range-separator</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"To"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start month"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End month"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">shortcuts</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">shortcuts</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> shortcuts</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'This month'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    value: [</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(), </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()],</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'This year'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">().</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getFullYear</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(), </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [start, end]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Last 6 months'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setMonth</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(start.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getMonth</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 6</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [start, end]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="year-range" tabindex="-1">Year Range <span class="vp-tag">2.8.0</span> <a class="header-anchor vp-link" href="#year-range" aria-label="Permalink to &quot;Year Range ^(2.8.0)&quot;">​</a></h2><p>Picking a year range is supported.</p><!--[--><div text="sm" m="y-4" data-v-72294632><p>When in range mode, the left and right panels are linked by default. If you want the two panels to switch years independently, you can use the <code>unlink-panels</code> attribute.</p>
</div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-09b442b4><div class="block" data-v-09b442b4><span class="demonstration" data-v-09b442b4>Default</span><!--[--><div class="el-date-editor el-date-editor--yearrange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-30" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start Year" value class="el-range-input"><!--[--><span class="el-range-separator">To</span><!--]--><input autocomplete="off" name placeholder="End Year" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-09b442b4><span class="demonstration" data-v-09b442b4>With quick options</span><!--[--><div class="el-date-editor el-date-editor--yearrange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-31" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start Year" value class="el-range-input"><!--[--><span class="el-range-separator">To</span><!--]--><input autocomplete="off" name placeholder="End Year" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/year-range.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Default&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"yearrange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        range-separator</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"To"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start Year"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End Year"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>With quick options&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"yearrange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        unlink-panels</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        range-separator</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"To"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start Year"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End Year"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">shortcuts</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">shortcuts</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> shortcuts</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'This Year'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    value: [</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(), </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()],</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Last 10 years'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">        new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">().</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setFullYear</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">().</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getFullYear</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">-</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 10</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      )</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [start, end]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  {</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    text: </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'Next 50 years'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">    value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: () </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">()</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">        new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">().</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">setFullYear</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">().</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">getFullYear</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 50</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      )</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">      return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [start, end]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">]</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="default-value" tabindex="-1">Default Value <a class="header-anchor vp-link" href="#default-value" aria-label="Permalink to &quot;Default Value&quot;">​</a></h2><p>If user hasn&#39;t picked a date, shows today&#39;s calendar by default. You can use <code>default-value</code> to set another date. Its value should be parsable by <code>new Date()</code>.</p><p>If type is <code>daterange</code>, <code>default-value</code> sets the left side calendar.</p><!--[--><div text="sm" m="y-4" data-v-72294632></div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-654c5ae3><div class="block" data-v-654c5ae3><span class="demonstration" data-v-654c5ae3>date</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-36" type="text" autocomplete="off" tabindex="0" placeholder="Pick a date" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-654c5ae3><span class="demonstration" data-v-654c5ae3>daterange</span><!--[--><div class="el-date-editor el-date-editor--daterange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-37" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start Date" value class="el-range-input"><!--[--><span class="el-range-separator">-</span><!--]--><input autocomplete="off" name placeholder="End Date" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/default-value.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>date&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a date"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">default-value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2010</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">9</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>daterange&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"daterange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start Date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End Date"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">default-value</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">[</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2010</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">9</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">), </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2010</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">10</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)]</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="date-formats" tabindex="-1">Date Formats <a class="header-anchor vp-link" href="#date-formats" aria-label="Permalink to &quot;Date Formats&quot;">​</a></h2><p>Use <code>format</code> to control displayed text&#39;s format in the input box. Use <code>value-format</code> to control binding value&#39;s format.</p><p>By default, the component accepts and emits a <code>Date</code> object.</p><p>Check the list <a href="https://day.js.org/docs/en/display/format#list-of-all-available-formats" class="vp-link" target="_blank" rel="noreferrer">here<svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" class="link-icon"><path fill="currentColor" d="M10 6v2H5v11h11v-5h2v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h6zm11-3v8h-2V6.413l-7.793 7.794l-1.414-1.414L17.585 5H13V3h8z"></path></svg></a> of all available formats of Day.js.</p><div class="warning custom-block"><p class="custom-block-title">WARNING</p><p>Pay attention to capitalization</p></div><!--[--><div text="sm" m="y-4" data-v-72294632></div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-d8be5964><div class="block" data-v-d8be5964><span class="demonstration" data-v-d8be5964>Emits Date object</span><div class="demonstration" data-v-d8be5964>Value: </div><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-42" type="text" autocomplete="off" tabindex="0" placeholder="Pick a Date" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-d8be5964><span class="demonstration" data-v-d8be5964>Use value-format</span><div class="demonstration" data-v-d8be5964>Value：</div><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-43" type="text" autocomplete="off" tabindex="0" placeholder="Pick a Date" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="block" data-v-d8be5964><span class="demonstration" data-v-d8be5964>Timestamp</span><div class="demonstration" data-v-d8be5964>Value：</div><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-44" type="text" autocomplete="off" tabindex="0" placeholder="Pick a Date" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/date-formats.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Emits Date object&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Value: {{ value1 }}&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a Date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY/MM/DD"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Use value-format&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Value：{{ value2 }}&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a Date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY/MM/DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        value-format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY-MM-DD"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Timestamp&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Value：{{ value3 }}&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value3</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a Date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY/MM/DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        value-format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"x"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value3</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="default-time-for-start-date-and-end-date" tabindex="-1">Default time for start date and end date <a class="header-anchor vp-link" href="#default-time-for-start-date-and-end-date" aria-label="Permalink to &quot;Default time for start date and end date&quot;">​</a></h2><p>When picking a date range, you can assign the time part for start date and end date.</p><!--[--><div text="sm" m="y-4" data-v-72294632><p>By default, the time part of start date and end date are both <code>00:00:00</code>. Setting <code>default-time</code> can change their time respectively. It accepts an array of up to two Date objects. The first string sets the time for the start date, and the second for the end date.</p>
</div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-c0eadb5b><div class="block" data-v-c0eadb5b><p data-v-c0eadb5b>Component value：</p><!--[--><div class="el-date-editor el-date-editor--daterange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-49" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start date" value class="el-range-input"><!--[--><span class="el-range-separator">-</span><!--]--><input autocomplete="off" name placeholder="End date" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/default-time.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">p</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>Component value：{{ value }}&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">p</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"daterange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End date"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">default-time</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">defaultTime</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> defaultTime</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;[</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">]>([</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">),</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  new</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> Date</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2000</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">2</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">23</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">59</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">59</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">),</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">])</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="set-custom-content-of-prefix" tabindex="-1">Set custom content of prefix <a class="header-anchor vp-link" href="#set-custom-content-of-prefix" aria-label="Permalink to &quot;Set custom content of prefix&quot;">​</a></h2><p>The content of prefix can be customized.</p><!--[--><div text="sm" m="y-4" data-v-72294632><p>Setting <code>prefix-icon</code> to component which you import form other .vue or generated by the render function.</p>
</div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-3e2a0971><div class="block" data-v-3e2a0971><span class="demonstration" data-v-3e2a0971>set prefix-icon</span><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><p>pre</p><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-54" type="text" autocomplete="off" tabindex="0" placeholder="Pick a day" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/custom-prefix-icon.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>set prefix-icon&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">        placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a day"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prefix-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">customPrefix</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { h, ref, shallowRef } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> customPrefix</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> shallowRef</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">({</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">  render</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">() {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">    return</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> h</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'p'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">, </span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'pre'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  },</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">})</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="custom-content" tabindex="-1">Custom content <a class="header-anchor vp-link" href="#custom-content" aria-label="Permalink to &quot;Custom content&quot;">​</a></h2><p>The content of cell can be customized, in scoped-slot you can get the cell data. Note that the custom content structure should be consistent with the default structure, otherwise style misalignment may occur.</p><!--[--><div text="sm" m="y-4" data-v-72294632></div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker" data-v-b3e89688><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-59" type="text" autocomplete="off" tabindex="0" placeholder="Pick a day" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--month el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-60" type="text" autocomplete="off" tabindex="0" placeholder="Pick a month" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--year el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-61" type="text" autocomplete="off" tabindex="0" placeholder="Pick a year" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/custom-content.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">      v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">      type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">      placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a day"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">      format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY/MM/DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">      value-format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY-MM-DD"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">cell</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"cell"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">{ current: cell.isCurrent }</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"text"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>{{ cell.text }}&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> v-if</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">isHoliday</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(cell)</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"holiday"</span><span style="--shiki-light:#B31D28;--shiki-dark:#FDAEB7;--shiki-light-font-style:italic;--shiki-dark-font-style:italic"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">month</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"month"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a month"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">cell</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"el-date-table-cell"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">{ current: cell.isCurrent }</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"el-date-table-cell__text"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>{{ cell.text </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> }}期&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">year</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"year"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a year"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">default</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">cell</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"el-date-table-cell"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> :</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">{ current: cell.isCurrent }</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"el-date-table-cell__text"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>{{ cell.text </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">+</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> }}y&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">span</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'2021-10-29'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> month</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> year</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> holidays</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> [</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  '2021-10-01'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  '2021-10-02'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  '2021-10-03'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  '2021-10-04'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  '2021-10-05'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  '2021-10-06'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">  '2021-10-07'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">,</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">]</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> isHoliday</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> ({ </span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">dayjs</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> }) </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">=></span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">  return</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> holidays.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">includes</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(dayjs.</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">'YYYY-MM-DD'</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">))</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  justify-content</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">space-between</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.cell</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  height</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">3</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  box-sizing</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">border-box</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.cell</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .text</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  height</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> auto</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  line-height</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">24</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  position</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">absolute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  left</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  transform</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">translateX</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">-50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-radius</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.cell.current</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .text</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  background</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">#626aef</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">#fff</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.cell</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .holiday</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  position</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">absolute</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">6</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  height</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">6</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  background</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-color-danger</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-radius</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  left</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  transform</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">translateX</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">-50</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><h2 id="custom-icon" tabindex="-1">Custom icon <span class="vp-tag">2.8.0</span> <a class="header-anchor vp-link" href="#custom-icon" aria-label="Permalink to &quot;Custom icon ^(2.8.0)&quot;">​</a></h2><p>Custom icons available with slots.</p><!--[--><div text="sm" m="y-4" data-v-72294632></div><div class="example" data-v-72294632><div class="example-showcase" data-v-72294632><!--[--><div class="demo-date-picker-icon" data-v-efbf19cd><div class="container" data-v-efbf19cd><div class="block" data-v-efbf19cd><div class="demonstration" data-v-efbf19cd>date</div><!--[--><div aria-haspopup="dialog" aria-expanded="false" class="el-input el-input--prefix el-input--suffix el-date-editor el-date-editor--date el-tooltip__trigger el-tooltip__trigger" style="" role="combobox"><!-- input --><!--[--><!-- prepend slot --><!--v-if--><div class="el-input__wrapper"><!-- prefix slot --><span class="el-input__prefix"><span class="el-input__prefix-inner"><!--[--><i class="el-icon el-input__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><!--]--><!--v-if--></span></span><input class="el-input__inner" name aria-controls="el-id-1024-66" type="text" autocomplete="off" tabindex="0" placeholder="Pick a day" style=""><!-- suffix slot --><span class="el-input__suffix"><span class="el-input__suffix-inner"><!--[--><!--[--><!--]--><!--v-if--><!--]--><!--v-if--><!--v-if--><!--v-if--><!--v-if--></span></span></div><!-- append slot --><!--v-if--><!--]--></div><!--teleport start--><!--teleport end--><!--]--></div><div class="line" data-v-efbf19cd></div><div class="block" data-v-efbf19cd><div class="demonstration" data-v-efbf19cd>date range</div><!--[--><div class="el-date-editor el-date-editor--daterange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-67" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start date" value class="el-range-input"><!--[--><span class="el-range-separator">-</span><!--]--><input autocomplete="off" name placeholder="End date" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div></div><div class="container" data-v-efbf19cd><div class="line" data-v-efbf19cd></div><div class="block" data-v-efbf19cd><div class="demonstration" data-v-efbf19cd>month range</div><!--[--><div class="el-date-editor el-date-editor--monthrange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-68" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start date" value class="el-range-input"><!--[--><span class="el-range-separator">-</span><!--]--><input autocomplete="off" name placeholder="End date" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div><div class="line" data-v-efbf19cd></div><div class="block" data-v-efbf19cd><div class="demonstration" data-v-efbf19cd>year range</div><!--[--><div class="el-date-editor el-date-editor--yearrange el-input__wrapper el-range-editor el-tooltip__trigger el-tooltip__trigger" style="" aria-controls="el-id-1024-69" aria-expanded="false" aria-haspopup="dialog"><i class="el-icon el-input__icon el-range__icon" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="M128 384v512h768V192H768v32a32 32 0 1 1-64 0v-32H320v32a32 32 0 0 1-64 0v-32H128v128h768v64zm192-256h384V96a32 32 0 1 1 64 0v32h160a32 32 0 0 1 32 32v768a32 32 0 0 1-32 32H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h160V96a32 32 0 0 1 64 0zm-32 384h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 0 1 0 64h-64a32 32 0 0 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m192-192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64m0 192h64a32 32 0 1 1 0 64h-64a32 32 0 1 1 0-64"></path></svg><!--]--></i><input autocomplete="off" name placeholder="Start Year" value class="el-range-input"><!--[--><span class="el-range-separator">To</span><!--]--><input autocomplete="off" name placeholder="End Year" value class="el-range-input"><i class="el-icon el-input__icon el-range__close-icon el-range__close-icon--hidden" style=""><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024"><path fill="currentColor" d="m466.752 512-90.496-90.496a32 32 0 0 1 45.248-45.248L512 466.752l90.496-90.496a32 32 0 1 1 45.248 45.248L557.248 512l90.496 90.496a32 32 0 1 1-45.248 45.248L512 557.248l-90.496 90.496a32 32 0 0 1-45.248-45.248z"></path><path fill="currentColor" d="M512 896a384 384 0 1 0 0-768 384 384 0 0 0 0 768m0 64a448 448 0 1 1 0-896 448 448 0 0 1 0 896"></path></svg><!--]--></i></div><!--teleport start--><!--teleport end--><!--]--></div></div></div><!--]--></div><div class="el-divider el-divider--horizontal m-0" style="--el-border-style:solid;" role="separator" data-v-72294632><!--v-if--></div><div class="op-btns" data-v-72294632><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Edit in Playground" tabindex="0" role="link" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M16 2v2h-1v3.243c0 1.158.251 2.301.736 3.352l4.282 9.276A1.5 1.5 0 0 1 18.656 22H5.344a1.5 1.5 0 0 1-1.362-2.129l4.282-9.276A7.994 7.994 0 0 0 9 7.243V4H8V2h8zm-2.612 8.001h-2.776c-.104.363-.23.721-.374 1.071l-.158.361L6.125 20h11.749l-3.954-8.567a9.978 9.978 0 0 1-.532-1.432zM11 7.243c0 .253-.01.506-.029.758h2.058a8.777 8.777 0 0 1-.021-.364L13 7.243V4h-2v3.243z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn github el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;color:var(--text-color-light);" data-v-72294632><!--[--><a href="https://github.com/element-plus/element-plus/edit/dev/docs/examples/date-picker/custom-icon.vue" aria-label="Edit on GitHub" rel="noreferrer noopener" target="_blank" data-v-72294632><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M5.883 18.653c-.3-.2-.558-.455-.86-.816a50.32 50.32 0 0 1-.466-.579c-.463-.575-.755-.84-1.057-.949a1 1 0 0 1 .676-1.883c.752.27 1.261.735 1.947 1.588c-.094-.117.34.427.433.539c.19.227.33.365.44.438c.204.137.587.196 1.15.14c.023-.382.094-.753.202-1.095C5.38 15.31 3.7 13.396 3.7 9.64c0-1.24.37-2.356 1.058-3.292c-.218-.894-.185-1.975.302-3.192a1 1 0 0 1 .63-.582c.081-.024.127-.035.208-.047c.803-.123 1.937.17 3.415 1.096A11.731 11.731 0 0 1 12 3.315c.912 0 1.818.104 2.684.308c1.477-.933 2.613-1.226 3.422-1.096c.085.013.157.03.218.05a1 1 0 0 1 .616.58c.487 1.216.52 2.297.302 3.19c.691.936 1.058 2.045 1.058 3.293c0 3.757-1.674 5.665-4.642 6.392c.125.415.19.879.19 1.38a300.492 300.492 0 0 1-.012 2.716a1 1 0 0 1-.019 1.958c-1.139.228-1.983-.532-1.983-1.525l.002-.446l.005-.705c.005-.708.007-1.338.007-1.998c0-.697-.183-1.152-.425-1.36c-.661-.57-.326-1.655.54-1.752c2.967-.333 4.337-1.482 4.337-4.66c0-.955-.312-1.744-.913-2.404a1 1 0 0 1-.19-1.045c.166-.414.237-.957.096-1.614l-.01.003c-.491.139-1.11.44-1.858.949a1 1 0 0 1-.833.135A9.626 9.626 0 0 0 12 5.315c-.89 0-1.772.119-2.592.35a1 1 0 0 1-.83-.134c-.752-.507-1.374-.807-1.868-.947c-.144.653-.073 1.194.092 1.607a1 1 0 0 1-.189 1.045C6.016 7.89 5.7 8.694 5.7 9.64c0 3.172 1.371 4.328 4.322 4.66c.865.097 1.201 1.177.544 1.748c-.192.168-.429.732-.429 1.364v3.15c0 .986-.835 1.725-1.96 1.528a1 1 0 0 1-.04-1.962v-.99c-.91.061-1.662-.088-2.254-.485z"></path></svg></a><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><i class="el-icon op-btn el-tooltip__trigger el-tooltip__trigger" style="font-size:16px;" aria-label="Copy code" tabindex="0" role="button" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="M7 6V3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1h-3v3c0 .552-.45 1-1.007 1H4.007A1.001 1.001 0 0 1 3 21l.003-14c0-.552.45-1 1.007-1H7zM5.003 8L5 20h10V8H5.003zM9 6h8v10h2V4H9v2z"></path></svg><!--]--></i><!--teleport start--><!--teleport end--><!--]--><!--[--><button aria-label="View source" class="reset-btn el-icon op-btn el-tooltip__trigger el-tooltip__trigger" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-72294632><path fill="currentColor" d="m23 12l-7.071 7.071l-1.414-1.414L20.172 12l-5.657-5.657l1.414-1.414L23 12zM3.828 12l5.657 5.657l-1.414 1.414L1 12l7.071-7.071l1.414 1.414L3.828 12z"></path></svg><!--]--></i></button><!--teleport start--><!--teleport end--><!--]--></div><div style="display:none;" class="example-source-wrapper" data-v-72294632 data-v-92bf09f8><div class="example-source" data-v-92bf09f8><div class="language-vue vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">vue</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0" v-pre=""><code><span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demo-date-picker-icon"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"container"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>date&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value1</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Pick a day"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY/MM/DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          value-format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY-MM-DD"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prev-month</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">CaretLeft</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> />&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">next-month</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">CaretRight</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> />&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prev-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">next-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"line"</span><span style="--shiki-light:#B31D28;--shiki-dark:#FDAEB7;--shiki-light-font-style:italic;--shiki-dark-font-style:italic"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>date range&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value2</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"daterange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY/MM/DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          value-format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY-MM-DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          unlink-panels</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prev-month</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">CaretLeft</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> />&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">next-month</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">CaretRight</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> />&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prev-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">next-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"container"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"line"</span><span style="--shiki-light:#B31D28;--shiki-dark:#FDAEB7;--shiki-light-font-style:italic;--shiki-dark-font-style:italic"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>month range&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value3</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"monthrange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End date"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY/MM/DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          value-format</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"YYYY-MM-DD"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          unlink-panels</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prev-month</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">CaretLeft</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> />&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">next-month</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">CaretRight</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> />&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prev-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">next-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"line"</span><span style="--shiki-light:#B31D28;--shiki-dark:#FDAEB7;--shiki-light-font-style:italic;--shiki-dark-font-style:italic"> /</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"block"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> class</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"demonstration"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">>year range&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          v-model</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">value4</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"yearrange"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          range-separator</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"To"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          start-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"Start Year"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">          end-placeholder</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"End Year"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">prev-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M8.73171,16.7949 C9.03264,17.0795 9.50733,17.0663 9.79196,16.7654 C10.0766,16.4644 10.0634,15.9897 9.76243,15.7051 L4.52339,10.75 L17.2471,10.75 C17.6613,10.75 17.9971,10.4142 17.9971,10 C17.9971,9.58579 17.6613,9.25 17.2471,9.25 L4.52112,9.25 L9.76243,4.29275 C10.0634,4.00812 10.0766,3.53343 9.79196,3.2325 C9.50733,2.93156 9.03264,2.91834 8.73171,3.20297 L2.31449,9.27241 C2.14819,9.4297 2.04819,9.62981 2.01448,9.8386 C2.00308,9.89058 1.99707,9.94459 1.99707,10 C1.99707,10.0576 2.00356,10.1137 2.01585,10.1675 C2.05084,10.3733 2.15039,10.5702 2.31449,10.7254 L8.73171,16.7949 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> #</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">next-year</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                viewBox</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"0 0 20 20"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                version</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1.1"</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                xmlns</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"http://www.w3.org/2000/svg"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              ></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> stroke-width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"1"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill-rule</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"evenodd"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> fill</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"currentColor"</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    &#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">path</span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">                      d</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"M11.2654,3.20511 C10.9644,2.92049 10.4897,2.93371 10.2051,3.23464 C9.92049,3.53558 9.93371,4.01027 10.2346,4.29489 L15.4737,9.25 L2.75,9.25 C2.33579,9.25 2,9.58579 2,10.0000012 C2,10.4142 2.33579,10.75 2.75,10.75 L15.476,10.75 L10.2346,15.7073 C9.93371,15.9919 9.92049,16.4666 10.2051,16.7675 C10.4897,17.0684 10.9644,17.0817 11.2654,16.797 L17.6826,10.7276 C17.8489,10.5703 17.9489,10.3702 17.9826,10.1614 C17.994,10.1094 18,10.0554 18,10.0000012 C18,9.94241 17.9935,9.88633 17.9812,9.83246 C17.9462,9.62667 17.8467,9.42976 17.6826,9.27455 L11.2654,3.20511 Z"</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                    /></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">                &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">g</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">              &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">svg</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">            &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">          &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">        &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">el-date-picker</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">      &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">    &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">  &#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">div</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">template</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> lang</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">=</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">"ts"</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> setup</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { ref } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> 'vue'</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">import</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> { CaretLeft, CaretRight } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF"> '@element-plus/icons-vue'</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value2</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value3</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">const</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> value4</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583"> =</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> ref</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF">''</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">)</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">script</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> scoped</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  width</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">100</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">%</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex-wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">wrap</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  padding</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">30</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 0</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  text-align</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">center</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  flex</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">1</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .block:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-top</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">solid</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> 1</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF"> var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-border-color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .container:last-child</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  border-right</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">none</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0">.demo-date-picker-icon</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0"> .demonstration</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8"> {</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  display</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">block</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  color</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">var</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">(</span><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70">--el-text-color-secondary</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">);</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  font-size</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">14</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">  margin-bottom</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">: </span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF">20</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583">px</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">}</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">&#x3C;/</span><span style="--shiki-light:#22863A;--shiki-dark:#85E89D">style</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8">></span></span></code></pre>
</div></div></div><div style="display:none;" class="example-float-control" tabindex="0" role="button" data-v-72294632><i class="el-icon" style="font-size:16px;" data-v-72294632><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-72294632><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg><!--]--></i><span data-v-72294632>Hide source</span></div></div><!--]--><p>For data details, please refer:</p><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">interface</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> DateCell</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> {</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  column</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  customClass</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> string</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  disabled</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  end</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  inRange</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  row</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  selected</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Dayjs</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  isCurrent</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  isSelected</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  start</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> boolean</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  text</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  timestamp</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#005CC5;--shiki-dark:#79B8FF;"> number</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  date</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Date</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  dayjs</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Dayjs</span></span>
<span class="line"><span style="--shiki-light:#E36209;--shiki-dark:#FFAB70;">  type</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">:</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;normal&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;today&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;week&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;next-month&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;prev-month&#39;</span></span>
<span class="line"><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">}</span></span></code></pre></div><h2 id="localization" tabindex="-1">Localization <a class="header-anchor vp-link" href="#localization" aria-label="Permalink to &quot;Localization&quot;">​</a></h2><p>The default locale of is English, if you need to use other languages, please check <a href="/en-US/guide/i18n.html" class="vp-link">Internationalization</a></p><p>Note, date time locale (month name, first day of the week ...) are also configured in localization.</p><h2 id="api" tabindex="-1">API <a class="header-anchor vp-link" href="#api" aria-label="Permalink to &quot;API&quot;">​</a></h2><h3 id="attributes" tabindex="-1">Attributes <a class="header-anchor vp-link" href="#attributes" aria-label="Permalink to &quot;Attributes&quot;">​</a></h3><div class="vp-table"><table><thead><tr><th>Name</th><th>Description</th><th>Type</th><th>Default</th></tr></thead><tbody><tr><td>model-value / v-model</td><td>binding value, if it is an array, the length should be 2</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">number</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>&#39;&#39;</td></tr><tr><td>readonly</td><td>whether DatePicker is read only</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span></td><td>false</td></tr><tr><td>disabled</td><td>whether DatePicker is disabled</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span></td><td>false</td></tr><tr><td>size</td><td>size of Input</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">enum</code><!----></span></td><td>—</td></tr><tr><td>editable</td><td>whether the input is editable</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span></td><td>true</td></tr><tr><td>clearable</td><td>whether to show clear button</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span></td><td>true</td></tr><tr><td>placeholder</td><td>placeholder in non-range mode</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span></td><td>&#39;&#39;</td></tr><tr><td>start-placeholder</td><td>placeholder for the start date in range mode</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span></td><td>—</td></tr><tr><td>end-placeholder</td><td>placeholder for the end date in range mode</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span></td><td>—</td></tr><tr><td>type</td><td>type of the picker</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">enum</code><!----></span></td><td>date</td></tr><tr><td>format</td><td>format of the displayed value in the input box</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> see <a href="/en-US/component/date-picker.html#date-formats" class="vp-link">date formats</a></td><td>YYYY-MM-DD</td></tr><tr><td>popper-class</td><td>custom class name for DatePicker&#39;s dropdown</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span></td><td>—</td></tr><tr><td>popper-options</td><td>Customized popper option see more at <a href="https://popper.js.org/docs/v2/" class="vp-link" target="_blank" rel="noreferrer">popper.js<svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" class="link-icon"><path fill="currentColor" d="M10 6v2H5v11h11v-5h2v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h6zm11-3v8h-2V6.413l-7.793 7.794l-1.414-1.414L17.585 5H13V3h8z"></path></svg></a></td><td><span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>{}</td></tr><tr><td>range-separator</td><td>range separator</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span></td><td>&#39;-&#39;</td></tr><tr><td>default-value</td><td>optional, default date of the calendar</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>—</td></tr><tr><td>default-time</td><td>optional, the time value to use when selecting date range</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>—</td></tr><tr><td>value-format</td><td>optional, format of binding value. If not specified, the binding value will be a Date object</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> see <a href="/en-US/component/date-picker.html#date-formats" class="vp-link">date formats</a></td><td>—</td></tr><tr><td>id</td><td>same as <code>id</code> in native input</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>—</td></tr><tr><td>name</td><td>same as <code>name</code> in native input</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>&#39;&#39;</td></tr><tr><td>unlink-panels</td><td>unlink two date-panels in range-picker</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span></td><td>false</td></tr><tr><td>prefix-icon</td><td>custom prefix icon component. By default, if the value of <code>type</code> is <code>TimeLikeType</code>, the value is <code>Clock</code>, else is <code>Calendar</code></td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>&#39;&#39;</td></tr><tr><td>clear-icon</td><td>custom clear icon component</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td><code>CircleClose</code></td></tr><tr><td>validate-event</td><td>whether to trigger form validation</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span></td><td>true</td></tr><tr><td>disabled-date</td><td>a function determining if a date is disabled with that date as its parameter. Should return a Boolean</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td><td>—</td></tr><tr><td>shortcuts</td><td>an object array to set shortcut options</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">object</code><!----></span></td><td>[]</td></tr><tr><td>cell-class-name</td><td>set custom className</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td><td>—</td></tr><tr><td>teleported</td><td>whether date-picker dropdown is teleported to the body</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span></td><td>true</td></tr><tr><td>empty-values <span class="vp-tag">2.7.0</span></td><td>empty values of component, <a href="/en-US/component/config-provider.html#empty-values-configurations" class="vp-link">see config-provider</a></td><td><span class="inline-flex items-center"><code class="api-typing mr-1">array</code><!----></span></td><td>—</td></tr><tr><td>value-on-clear <span class="vp-tag">2.7.0</span></td><td>clear return value, <a href="/en-US/component/config-provider.html#empty-values-configurations" class="vp-link">see config-provider</a></td><td><span class="inline-flex items-center"><code class="api-typing mr-1">string</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">number</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">boolean</code><!----></span> / <span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td><td>—</td></tr><tr><td>fallback-placements <span class="vp-tag">2.8.4</span></td><td>list of possible positions for Tooltip <a href="https://popper.js.org/docs/v2/modifiers/flip/#fallbackplacements" class="vp-link" target="_blank" rel="noreferrer">popper.js<svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" class="link-icon"><path fill="currentColor" d="M10 6v2H5v11h11v-5h2v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h6zm11-3v8h-2V6.413l-7.793 7.794l-1.414-1.414L17.585 5H13V3h8z"></path></svg></a></td><td><span class="inline-flex items-center"><code class="api-typing mr-1">arrary</code><!----></span></td><td>—</td></tr><tr><td>placement <span class="vp-tag">2.8.4</span></td><td>position of dropdown</td><td><code>Placement</code></td><td>bottom</td></tr></tbody></table></div><h3 id="events" tabindex="-1">Events <a class="header-anchor vp-link" href="#events" aria-label="Permalink to &quot;Events&quot;">​</a></h3><div class="vp-table"><table><thead><tr><th>Name</th><th>Description</th><th>Type</th></tr></thead><tbody><tr><td>change</td><td>triggers when user confirms the value</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>blur</td><td>triggers when Input blurs</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>focus</td><td>triggers when Input focuses</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>clear <span class="vp-tag">2.7.7</span></td><td>triggers when the clear icon is clicked in a clearable DatePicker</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>calendar-change</td><td>triggers when the calendar selected date is changed.</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>panel-change</td><td>triggers when the navigation button click.</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>visible-change</td><td>triggers when the DatePicker&#39;s dropdown appears/disappears</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr></tbody></table></div><h3 id="slots" tabindex="-1">Slots <a class="header-anchor vp-link" href="#slots" aria-label="Permalink to &quot;Slots&quot;">​</a></h3><div class="vp-table"><table><thead><tr><th>Name</th><th>Description</th></tr></thead><tbody><tr><td>default</td><td>custom cell content</td></tr><tr><td>range-separator</td><td>custom range separator content</td></tr><tr><td>prev-month <span class="vp-tag">2.8.0</span></td><td>prev month icon</td></tr><tr><td>next-month <span class="vp-tag">2.8.0</span></td><td>next month icon</td></tr><tr><td>prev-year <span class="vp-tag">2.8.0</span></td><td>prev year icon</td></tr><tr><td>next-year <span class="vp-tag">2.8.0</span></td><td>next year icon</td></tr></tbody></table></div><h3 id="exposes" tabindex="-1">Exposes <a class="header-anchor vp-link" href="#exposes" aria-label="Permalink to &quot;Exposes&quot;">​</a></h3><div class="vp-table"><table><thead><tr><th>Name</th><th>Description</th><th>Type</th></tr></thead><tbody><tr><td>focus</td><td>focus the Input component</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>handleOpen <span class="vp-tag">2.2.16</span></td><td>open the DatePicker popper</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr><tr><td>handleClose <span class="vp-tag">2.2.16</span></td><td>close the DatePicker popper</td><td><span class="inline-flex items-center"><code class="api-typing mr-1">Function</code><!----></span></td></tr></tbody></table></div><h2 id="type-declarations" tabindex="-1">Type Declarations <a class="header-anchor vp-link" href="#type-declarations" aria-label="Permalink to &quot;Type Declarations&quot;">​</a></h2><details><summary>Show declarations</summary><div class="language-ts vp-adaptive-theme"><button title="Copy Code" class="copy"></button><span class="lang">ts</span><pre class="shiki shiki-themes github-light github-dark vp-code" tabindex="0"><code><span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">import</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> type</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> { Options </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">as</span><span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;"> PopperOptions } </span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">from</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;@popperjs/core&#39;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> TimeLikeType</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;datetime&#39;</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;datetimerange&#39;</span></span>
<span class="line"></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">type</span><span style="--shiki-light:#6F42C1;--shiki-dark:#B392F0;"> Placement</span><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;"> =</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;top&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;top-start&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;top-end&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;bottom&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;bottom-start&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;bottom-end&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;left&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;left-start&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;left-end&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;right&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;right-start&#39;</span></span>
<span class="line"><span style="--shiki-light:#D73A49;--shiki-dark:#F97583;">  |</span><span style="--shiki-light:#032F62;--shiki-dark:#9ECBFF;"> &#39;right-end&#39;</span></span></code></pre></div></details><h2 id="source" tabindex="-1">Source <a class="header-anchor vp-link" href="#source" aria-label="Permalink to &quot;Source&quot;">​</a></h2><p><a href="https://github.com/element-plus/element-plus/tree/dev/packages/components/date-picker" class="vp-link" target="_blank" rel="noreferrer">Component<svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" class="link-icon"><path fill="currentColor" d="M10 6v2H5v11h11v-5h2v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h6zm11-3v8h-2V6.413l-7.793 7.794l-1.414-1.414L17.585 5H13V3h8z"></path></svg></a> • <a href="https://github.com/element-plus/element-plus/tree/dev/packages/theme-chalk/src/date-picker.scss" class="vp-link" target="_blank" rel="noreferrer">Style<svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" class="link-icon"><path fill="currentColor" d="M10 6v2H5v11h11v-5h2v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h6zm11-3v8h-2V6.413l-7.793 7.794l-1.414-1.414L17.585 5H13V3h8z"></path></svg></a> • <a href="https://github.com/element-plus/element-plus/blob/dev/docs/en-US/component/date-picker.md" class="vp-link" target="_blank" rel="noreferrer">Docs<svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" class="link-icon"><path fill="currentColor" d="M10 6v2H5v11h11v-5h2v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h6zm11-3v8h-2V6.413l-7.793 7.794l-1.414-1.414L17.585 5H13V3h8z"></path></svg></a></p><h2 id="contributors" tabindex="-1">Contributors <a class="header-anchor vp-link" href="#contributors" aria-label="Permalink to &quot;Contributors&quot;">​</a></h2><div class="mb-4" data-v-a7f8c63c><div class="flex flex-wrap gap-4 pt-2" data-v-a7f8c63c><!--[--><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/jw-foss" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/15975785?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Jeremy<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/sxzz" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/6481596?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 三咲智子<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/btea" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/24516654?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> btea<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/YunYouJun" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/25154432?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 云游君<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/msidolphin" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/26672484?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> msidolphin<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/chenxch" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/23251408?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Xc<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/holazz" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/23100055?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> zz<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/tolking" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/23313167?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> qiang<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/emojiiii" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/30518686?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> C.Y.Kun<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Alanscut" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/21104054?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Alan Wang<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/adaex" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/29560987?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Aex<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/warmthsea" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/45450994?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> sea / 神秘海<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/FrontEndDog" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/46493087?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 一只前端汪<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Chuck-Lau" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/50739490?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> LIUCHAO<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/gjfei" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/33827314?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> gjfei<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/opengraphica" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/57385187?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> opengraphica<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/CherishTheYouth" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/41944818?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Robert Zeng<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/makedopamine" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/93767616?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> dopamine<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/kooriookami" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/38392315?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> kooriookami<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/wzc520pyfm" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/69044080?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> wzc520pyfm<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/purepear" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/144010?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Delyan Haralanov<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/xingyixiang" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/24290011?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> xingyixiang<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/zhixiaotong" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/34681550?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 知晓同丶<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/lyric-zemin" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/54665054?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> lyric-zemin<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/mdoi2" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/6340506?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Masanori Doizaki<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Panzer-Jack" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/81006731?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Panzer_Jack<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/dddssw" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/58782768?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 锌小子<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/xiaodong2008" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/84657208?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> XiaoDong<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Gnalvin" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/31533594?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Ganlvin<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/yuchenii" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/57935341?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> yuchen<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/betavs" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/34408516?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> betavs<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/ivan0525" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/42532333?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> ivan0525<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Justineo" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/1726061?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> GU Yiling<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Karolis-Stoncius" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/108655466?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Karolis_Stoncius_Sneakybox<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/inottn" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/18509404?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> inottn<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/kamesan012" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/79386745?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> kamesan012<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/evanryuu" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/55378595?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Evan Liu<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/HeftyKoo" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/10278227?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Hefty<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Brain777777" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/35163869?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Brain777777<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/MrWeilian" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/30046649?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 井柏然<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/SnowingFox" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/26035718?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> snowingfox<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/jagoncalves14" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/17235977?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> João Gonçalves<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Garthguo" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/82928935?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> wangzi<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Giwayume" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/4075314?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Giwayume<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/banbri" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/44187480?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> banbri<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/iamkun" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/17680888?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> iamkun<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/shenX-2021" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/35101675?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Zivvvv<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/lily-elephant" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/19464247?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> lily-elephant<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/plainheart" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/26999792?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Zhongxiang Wang<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/nabaonan" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/17247526?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 内小子<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/Hades-li" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/12124478?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Hades-li<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/xiaoxian521" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/44761321?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> RealityBoy<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/pany-ang" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/49087880?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> pany<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/typed-sigterm" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/145281501?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Typed SIGTERM<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/kaine0923" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/121680374?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Kaine<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/loosheng" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/30114549?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> LooSheng<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/weidehai" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/25458528?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> weidehai<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/0song" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/82012629?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> 0song<!--]--><!----></a></div><div data-v-a7f8c63c><a class="link-item link flex gap-2 items-center link" href="https://github.com/CarterLi" target="_blank" rel="noopener noreferrer" data-v-a7f8c63c data-v-d0bc45d6><!--[--><img src="https://avatars.githubusercontent.com/u/6134068?v=4&amp;size=64" class="w-8 h-8 rounded-full" loading="lazy" data-v-a7f8c63c> Carter Li<!--]--><!----></a></div><!--]--></div></div></div></div><footer class="page-footer" data-v-d3d41891><div class="edit" data-v-d3d41891><div class="edit-link" data-v-d3d41891 data-v-60059381><a class="link text-sm" href="https://github.com/element-plus/element-plus/edit/dev/docs/en-US/component/date-picker.md" target="_blank" rel="noopener noreferrer" data-v-60059381>Edit this page on GitHub <i class="el-icon" style="font-size:16px;vertical-align:text-top;line-height:24px;" data-v-60059381><!--[--><svg preserveaspectratio="xMidYMid meet" viewbox="0 0 24 24" width="1.2em" height="1.2em" data-v-60059381><path fill="currentColor" d="M10 6v2H5v11h11v-5h2v6a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V7a1 1 0 0 1 1-1h6zm11-3v8h-2V6.413l-7.793 7.794l-1.414-1.414L17.585 5H13V3h8z"></path></svg><!--]--></i></a></div></div></footer><div class="next-and-prev-link" data-v-1e11dad2><div class="container" data-v-1e11dad2><div class="prev" data-v-1e11dad2><a class="link" href="/en-US/component/color-picker" data-v-1e11dad2><i class="el-icon mr-1" style="" data-v-1e11dad2><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-1e11dad2><path fill="currentColor" d="M609.408 149.376 277.76 489.6a32 32 0 0 0 0 44.672l331.648 340.352a29.12 29.12 0 0 0 41.728 0 30.592 30.592 0 0 0 0-42.752L339.264 511.936l311.872-319.872a30.592 30.592 0 0 0 0-42.688 29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i><span class="text" data-v-1e11dad2>Color Picker</span></a></div><div class="next" data-v-1e11dad2><a class="link" href="/en-US/component/datetime-picker" data-v-1e11dad2><span class="text" data-v-1e11dad2>DateTime Picker</span><i class="el-icon ml-1" style="" data-v-1e11dad2><!--[--><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 1024 1024" data-v-1e11dad2><path fill="currentColor" d="M340.864 149.312a30.592 30.592 0 0 0 0 42.752L652.736 512 340.864 831.872a30.592 30.592 0 0 0 0 42.752 29.12 29.12 0 0 0 41.728 0L714.24 534.336a32 32 0 0 0 0-44.672L382.592 149.376a29.12 29.12 0 0 0-41.728 0z"></path></svg><!--]--></i></a></div></div></div></div><aside class="toc-wrapper" data-v-7bfe172f><nav class="toc-content" data-v-7bfe172f><h3 class="toc-content__heading" data-v-7bfe172f>Contents</h3><div class="el-anchor el-anchor--vertical" data-v-7bfe172f><div class="el-anchor__marker" style=""></div><div class="el-anchor__list"><!--[--><!--[--><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#enter-date"><!--[--><div data-v-7bfe172f>Enter Date</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#other-measurements"><!--[--><div data-v-7bfe172f>Other measurements</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#date-range"><!--[--><div data-v-7bfe172f>Date Range</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#month-range"><!--[--><div data-v-7bfe172f>Month Range</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#year-range"><!--[--><div data-v-7bfe172f>Year Range <span class="vp-tag ">2.8.0</span></div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#default-value"><!--[--><div data-v-7bfe172f>Default Value</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#date-formats"><!--[--><div data-v-7bfe172f>Date Formats</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#default-time-for-start-date-and-end-date"><!--[--><div data-v-7bfe172f>Default time for start date and end date</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#set-custom-content-of-prefix"><!--[--><div data-v-7bfe172f>Set custom content of prefix</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#custom-content"><!--[--><div data-v-7bfe172f>Custom content</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#custom-icon"><!--[--><div data-v-7bfe172f>Custom icon <span class="vp-tag ">2.8.0</span></div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#localization"><!--[--><div data-v-7bfe172f>Localization</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#api"><!--[--><div data-v-7bfe172f>API</div><!--]--></a><div class="el-anchor__list"><!--[--><!--[--><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#attributes"><!--[--><div data-v-7bfe172f>Attributes</div><!--]--></a><!--v-if--></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#events"><!--[--><div data-v-7bfe172f>Events</div><!--]--></a><!--v-if--></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#slots"><!--[--><div data-v-7bfe172f>Slots</div><!--]--></a><!--v-if--></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#exposes"><!--[--><div data-v-7bfe172f>Exposes</div><!--]--></a><!--v-if--></div><!--]--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#type-declarations"><!--[--><div data-v-7bfe172f>Type Declarations</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#source"><!--[--><div data-v-7bfe172f>Source</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><div class="el-anchor__item" data-v-7bfe172f><a class="el-anchor__link" href="#contributors"><!--[--><div data-v-7bfe172f>Contributors</div><!--]--></a><div class="el-anchor__list"><!--[--><!--]--></div></div><!--]--><!--]--></div></div><p class="text-14px font-300 color-$text-color-secondary" data-v-7bfe172f>Sponsored by</p><div class="join sponsors-button mt-4 w-100%" data-v-7bfe172f><!--[--><a href="mailto:element-plus@outlook.com" target="_blank" class="el-tooltip__trigger"><button ariadisabled="false" type="button" class="el-button" style="overflow:hidden;"><!--v-if--><span class=""><!--[-->Become a Sponsor!<!--]--></span></button></a><!--teleport start--><!--teleport end--><!--]--></div><div class="right-big" data-v-7bfe172f data-v-3c6f7f06><!--[--><a href="http://github.crmeb.net/u/Elementyouce" title="CRMEB - 高品质开源商城系统 累计服务40W+开发者" target="_blank" data-v-3c6f7f06><div class="flex bg-#F9F9F9 h-64px rd-4px justify-center items-center" data-v-3c6f7f06><div class="h-36px" data-v-3c6f7f06><img class="rd-4px h-full" src="/images/sponsors/CRMEB-l.png" alt="CRMEB" data-v-3c6f7f06></div></div></a><!--]--></div><div class="flex flex-wrap justify-between right-small" data-v-7bfe172f data-v-8cecf616><!--[--><!--[--><a href="https://doc.buildadmin.com/?from=element-plus" title="BuildAdmin - Vue3企业级开源后台管理系统" target="_blank" data-v-8cecf616><div class="flex m-b-4px bg-#F9F9F9 rd-0px h-42px w-95px justify-center items-center" data-v-8cecf616><img src="/images/sponsors/buildadmin-l.png" alt="BuildAdmin" data-v-8cecf616></div></a><!--]--><!--[--><a href="http://www.i-renderer.love/home/index" title="百搭云 - 快速且优雅的低代码平台" target="_blank" data-v-8cecf616><div class="flex m-b-4px bg-#F9F9F9 rd-0px h-42px w-95px justify-center items-center" data-v-8cecf616><img src="/images/sponsors/baidayun.png" alt="百搭云" data-v-8cecf616></div></a><!--]--><!--[--><a href="https://bit.dev/?from=element-ui" title="bit - Share Code" target="_blank" data-v-8cecf616><div class="flex m-b-4px bg-#F9F9F9 rd-0px h-42px w-95px justify-center items-center" data-v-8cecf616><img src="/images/bit-l.png" alt="bit" data-v-8cecf616></div></a><!--]--><!--[--><div class="flex bg-#F9F9F9 rd-0px h-42px w-95px justify-center items-center" data-v-8cecf616><div class="color-#ddd text-13px cursor-default" data-v-8cecf616>Your logo</div></div><!--]--><!--]--></div><div class="right-rich" data-v-7bfe172f data-v-2b27a114><!--[--><!--]--></div></nav></aside></div><footer class="footer"><div class="footer-main"><h4>Links</h4><a href="https://github.com/element-plus/element-plus" class="footer-main-link" target="_blank">GitHub</a><a href="https://cn.element-plus.org/zh-CN/" class="footer-main-link" target="_blank">China Mirror 🇨🇳</a><a href="https://github.com/element-plus/element-plus/releases" class="footer-main-link" target="_blank">Changelog</a><a href="https://element.eleme.io/" class="footer-main-link" target="_blank">Element UI for Vue 2</a></div><div class="footer-main"><h4>Community</h4><a href="https://discord.com/invite/gXK9XNzW3X" class="footer-main-link" target="_blank">Discord</a><a href="https://github.com/element-plus/element-plus/issues" class="footer-main-link" target="_blank">Feedback</a><a href="https://github.com/element-plus/element-plus/blob/dev/.github/CONTRIBUTING.en-US.md" class="footer-main-link" target="_blank">Contribution</a><a href="https://segmentfault.com/t/element-plus" class="footer-main-link" target="_blank">SegmentFault</a></div></footer></main></div></div>
    <script>window.__VP_HASH_MAP__=JSON.parse("{\"es-es_component_overview.md\":\"sQoZatX9\",\"en-us_component_overview.md\":\"B-UHOZl9\",\"zh-cn_component_breadcrumb.md\":\"DGxDEIK2\",\"zh-cn_component_backtop.md\":\"DhMbjDUx\",\"zh-cn_component_overview.md\":\"BquN1ahR\",\"zh-cn_component_empty.md\":\"BpHg3aJJ\",\"zh-cn_guide_translation.md\":\"Dr9uqmqX\",\"zh-cn_guide_design.md\":\"C_8LPotI\",\"zh-cn_component_border.md\":\"BanmvXY6\",\"zh-cn_component_tree-select.md\":\"DgCp5XRY\",\"zh-cn_guide_transitions.md\":\"D8L0zSi7\",\"en-us_component_backtop.md\":\"DSVoq7le\",\"en-us_component_border.md\":\"0AWH44Bm\",\"en-us_guide_dark-mode.md\":\"DKSXTXjw\",\"en-us_component_breadcrumb.md\":\"DLAh-3p_\",\"en-us_index.md\":\"apytNG3y\",\"en-us_resource_index.md\":\"DJqflRiF\",\"es-es_component_border.md\":\"TzY12A3_\",\"zh-cn_component_watermark.md\":\"A024A5qB\",\"zh-cn_component_infinite-scroll.md\":\"CjuCtyPO\",\"zh-cn_component_alert.md\":\"cVWXED3i\",\"es-es_resource_index.md\":\"BMkoCmQ2\",\"index.md\":\"CgX9lqrn\",\"zh-cn_component_loading.md\":\"DsGU-Qj8\",\"zh-cn_component_affix.md\":\"M5Wkzy_h\",\"zh-cn_component_tooltip-v2.md\":\"ColJQINZ\",\"es-es_index.md\":\"DaNeV-Ar\",\"zh-cn_component_result.md\":\"Ci0c5ODJ\",\"zh-cn_component_skeleton.md\":\"CZ3zN6Kh\",\"zh-cn_guide_dev-faq.md\":\"DxOiOLPv\",\"zh-cn_component_layout.md\":\"Dr5y2xHh\",\"zh-cn_guide_i18n.md\":\"BcrRsIr-\",\"zh-cn_guide_commit-examples.md\":\"BpDEgg2b\",\"zh-cn_guide_dark-mode.md\":\"1lb-EZsq\",\"zh-cn_index.md\":\"DipYR9Ey\",\"zh-cn_resource_index.md\":\"B0lAnbUk\",\"zh-cn_guide_nav.md\":\"IR_hqtEI\",\"en-us_component_badge.md\":\"DSffW1_c\",\"en-us_component_alert.md\":\"CaJ6--CJ\",\"zh-cn_component_page-header.md\":\"BbF2LAPr\",\"es-es_component_infinite-scroll.md\":\"CcxNzaa4\",\"en-us_component_collapse.md\":\"7IeLHEoz\",\"zh-cn_component_container.md\":\"C8hZCrRF\",\"zh-cn_component_segmented.md\":\"D1JFD4Kx\",\"zh-cn_guide_migration.md\":\"HlPSByNE\",\"zh-cn_component_avatar.md\":\"C-BHbpHS\",\"zh-cn_guide_changelog.md\":\"JZeTyhxS\",\"zh-cn_component_collapse.md\":\"H6vF1de6\",\"en-us_component_calendar.md\":\"BSdDBSpB\",\"en-us_component_result.md\":\"Blx1FH7Q\",\"zh-cn_component_drawer.md\":\"Cl3R8B55\",\"en-us_component_card.md\":\"CeClAgJK\",\"es-es_component_segmented.md\":\"BtsR3vBp\",\"zh-cn_component_card.md\":\"UPgi9TOR\",\"en-us_component_segmented.md\":\"DCo7527t\",\"en-us_component_button.md\":\"BKAEn6f8\",\"en-us_component_carousel.md\":\"BseVyeUV\",\"en-us_component_autocomplete.md\":\"CprxZQtI\",\"en-us_component_color-picker.md\":\"OoxS-o1x\",\"zh-cn_component_dialog.md\":\"Bk4J87gH\",\"en-us_component_checkbox.md\":\"CDCNt1q0\",\"en-us_component_drawer.md\":\"Bc9WQe6G\",\"en-us_component_empty.md\":\"DbkcUN36\",\"en-us_component_icon.md\":\"BcpHTJsq\",\"en-us_component_message.md\":\"BsEU0o3e\",\"en-us_component_menu.md\":\"C8eOWr8T\",\"en-us_component_date-picker.md\":\"UbBGLRRy\",\"en-us_component_infinite-scroll.md\":\"DYKQ1h24\",\"en-us_component_popover.md\":\"CoIBWPnb\",\"en-us_component_dropdown.md\":\"oVP8DmuJ\",\"en-us_component_page-header.md\":\"C3ArGDdX\",\"en-us_component_dialog.md\":\"BUCIx28R\",\"en-us_component_radio.md\":\"BZl10nu-\",\"en-us_component_notification.md\":\"DvVFNS9i\",\"en-us_component_descriptions.md\":\"Da0JwBXs\",\"es-es_component_input.md\":\"CH8tYH_d\",\"es-es_component_icon.md\":\"jtQwMyQs\",\"es-es_component_form.md\":\"cZSGNC2K\",\"en-us_component_config-provider.md\":\"4h6IMoUG\",\"en-us_guide_i18n.md\":\"CXhDVojW\",\"es-es_component_pagination.md\":\"ChsBVOL7\",\"es-es_component_popconfirm.md\":\"DM5N4d5h\",\"es-es_component_timeline.md\":\"UbaByDD7\",\"en-us_guide_dev-guide.md\":\"-8br4zaP\",\"en-us_guide_installation.md\":\"BPV7tanP\",\"es-es_component_rate.md\":\"BmeJKuFZ\",\"es-es_component_steps.md\":\"Ct8cSiyN\",\"es-es_component_config-provider.md\":\"D-WbfSFw\",\"es-es_component_layout.md\":\"C1OfYefX\",\"en-us_component_slider.md\":\"BBkV6S-U\",\"en-us_component_transfer.md\":\"Dkd4qZxw\",\"es-es_component_space.md\":\"1D8EctEI\",\"es-es_component_mention.md\":\"djXh8oUq\",\"es-es_component_badge.md\":\"C2N8x0Or\",\"es-es_component_skeleton.md\":\"DhRN3hl9\",\"en-us_component_tree-select.md\":\"DOOc6nOl\",\"en-us_component_typography.md\":\"B-5WYduF\",\"en-us_component_tree.md\":\"DCKh_4og\",\"es-es_component_popover.md\":\"DG_99Hid\",\"es-es_component_text.md\":\"DPo85KDr\",\"en-us_guide_migration.md\":\"BSZ6idWb\",\"es-es_component_time-select.md\":\"BF0FfdAt\",\"es-es_component_result.md\":\"ByRVuqP5\",\"es-es_component_time-picker.md\":\"yDoO57-X\",\"en-us_guide_namespace.md\":\"BCfmz8DC\",\"es-es_component_tooltip.md\":\"C6c7rCJL\",\"es-es_component_link.md\":\"bwObVZ46\",\"es-es_component_tooltip-v2.md\":\"DTP0fQiq\",\"es-es_component_tour.md\":\"C1GzdHbv\",\"es-es_component_transfer.md\":\"Bt43qKrE\",\"es-es_component_loading.md\":\"d8PdcdMU\",\"es-es_component_tree-select.md\":\"DO2T5E5A\",\"es-es_component_typography.md\":\"BqUndUCt\",\"es-es_component_input-number.md\":\"n0ZxK-cx\",\"es-es_component_tree-v2.md\":\"CQVu_VLq\",\"es-es_guide_changelog.md\":\"B4WWzcwa\",\"es-es_guide_commit-examples.md\":\"Bd_V6ky8\",\"es-es_guide_dark-mode.md\":\"uNj1J4Im\",\"es-es_guide_design.md\":\"IgpbAWwX\",\"es-es_guide_dev-guide.md\":\"D9WoA0hq\",\"es-es_guide_i18n.md\":\"CkR3hpg2\",\"es-es_component_upload.md\":\"DGqLhIVH\",\"es-es_guide_dev-faq.md\":\"CenNmYyk\",\"es-es_component_tree.md\":\"CZ9dVEEm\",\"es-es_guide_installation.md\":\"BEO2nV14\",\"zh-cn_component_config-provider.md\":\"VgZhk6Wr\",\"es-es_guide_quickstart.md\":\"CN-kjW1l\",\"es-es_guide_nav.md\":\"DZpwtuHV\",\"zh-cn_component_color-picker.md\":\"11B2hUCQ\",\"zh-cn_component_checkbox.md\":\"DothwVq8\",\"es-es_guide_migration.md\":\"BLo2wFbZ\",\"es-es_guide_namespace.md\":\"eW63BctQ\",\"es-es_guide_theming.md\":\"BafPsnjb\",\"es-es_guide_transitions.md\":\"CIid_hB1\",\"zh-cn_component_autocomplete.md\":\"Dl04X6-4\",\"es-es_guide_translation.md\":\"FhfM2rBU\",\"zh-cn_component_calendar.md\":\"CneXx5Ke\",\"en-us_guide_design.md\":\"ZGAKhQRQ\",\"es-es_component_notification.md\":\"E0lf2EXH\",\"zh-cn_component_badge.md\":\"DoxSXgPR\",\"zh-cn_component_cascader.md\":\"DQ105b9D\",\"en-us_guide_dev-faq.md\":\"pRDhAKPR\",\"zh-cn_component_carousel.md\":\"CjIHQe_v\",\"zh-cn_component_popover.md\":\"CCGYSy2I\",\"es-es_component_message-box.md\":\"CixifeLt\",\"en-us_component_progress.md\":\"BQulcWTZ\",\"en-us_component_select-v2.md\":\"Hu6NZmJO\",\"en-us_component_input-number.md\":\"D_dvZjM4\",\"en-us_component_select.md\":\"DEawzwpG\",\"en-us_component_input.md\":\"DJQNu3wy\",\"en-us_component_datetime-picker.md\":\"CIxnyNuQ\",\"en-us_component_mention.md\":\"KUHf72rD\",\"en-us_component_link.md\":\"CVliKNRE\",\"en-us_component_tag.md\":\"KWVsgD9f\",\"en-us_component_text.md\":\"CWSEZ3wp\",\"es-es_component_calendar.md\":\"DxbH0xbc\",\"en-us_component_cascader.md\":\"DeLVqXC-\",\"es-es_component_carousel.md\":\"Gf564JpS\",\"es-es_component_card.md\":\"DaaQV9RR\",\"es-es_component_checkbox.md\":\"CaQCNDzj\",\"es-es_component_color-picker.md\":\"Cg3OBhh8\",\"en-us_component_time-picker.md\":\"B7-Dsdmu\",\"es-es_component_collapse.md\":\"B8v_VEX0\",\"en-us_component_time-select.md\":\"gecZomR9\",\"en-us_component_statistic.md\":\"BEV69R7h\",\"en-us_component_timeline.md\":\"IhXj5ZjF\",\"en-us_component_tour.md\":\"B9O9NT_2\",\"en-us_component_tooltip-v2.md\":\"DYaPw2Y1\",\"en-us_guide_changelog.md\":\"BMDKPk3W\",\"es-es_component_container.md\":\"16pmq3oy\",\"en-us_component_skeleton.md\":\"CCKI-w4-\",\"es-es_component_button.md\":\"KvimZcti\",\"es-es_component_cascader.md\":\"CpN9zc4p\",\"es-es_component_descriptions.md\":\"O-_CduUR\",\"es-es_component_date-picker.md\":\"C9TUgR62\",\"es-es_component_datetime-picker.md\":\"D9mlyXCL\",\"es-es_component_drawer.md\":\"Bhe4cgAu\",\"en-us_component_pagination.md\":\"CrdBh2_p\",\"es-es_component_slider.md\":\"DKP3pHxd\",\"en-us_component_tree-v2.md\":\"SzBzLa7H\",\"en-us_component_message-box.md\":\"B217Gwqx\",\"es-es_component_empty.md\":\"2AlwVxmE\",\"en-us_component_upload.md\":\"87avIxXH\",\"es-es_component_dialog.md\":\"Bw6SVPZl\",\"es-es_component_progress.md\":\"CLedPKG-\",\"en-us_component_popconfirm.md\":\"BILL2n4r\",\"zh-cn_component_button.md\":\"BJeopcyl\",\"es-es_component_dropdown.md\":\"CydMU-aD\",\"zh-cn_component_statistic.md\":\"CInhcEIi\",\"es-es_component_radio.md\":\"BGbVwDK-\",\"zh-cn_component_steps.md\":\"CeQ39J86\",\"es-es_component_tag.md\":\"DvZJ0vIh\",\"es-es_guide_ssr.md\":\"D9Y3yiEd\",\"en-us_guide_quickstart.md\":\"CzflDkbG\",\"en-us_guide_ssr.md\":\"CtLJfUQI\",\"es-es_component_menu.md\":\"TxsLeSJx\",\"es-es_component_statistic.md\":\"BecjIPl0\",\"en-us_guide_transitions.md\":\"DARL9vmy\",\"zh-cn_component_radio.md\":\"DH8punGe\",\"zh-cn_component_progress.md\":\"Dc3yNjWl\",\"en-us_guide_nav.md\":\"Bi86SK8a\",\"zh-cn_component_scrollbar.md\":\"SPP_Edys\",\"zh-cn_component_slider.md\":\"CzRudoBs\",\"es-es_component_message.md\":\"DxjXAdlF\",\"zh-cn_component_text.md\":\"BnZAjPFy\",\"zh-cn_component_space.md\":\"hJ0OMjwt\",\"es-es_component_select-v2.md\":\"CNizWINW\",\"zh-cn_component_tour.md\":\"nvQMhNgc\",\"es-es_component_avatar.md\":\"Dw3UnwgU\",\"es-es_component_image.md\":\"SC6hPWIv\",\"zh-cn_component_transfer.md\":\"xnjjLrkJ\",\"zh-cn_guide_theming.md\":\"BTZkJ5IB\",\"en-us_component_color.md\":\"DQ_Kvwv4\",\"zh-cn_component_tree.md\":\"Uel-AFLY\",\"es-es_component_affix.md\":\"HN8-TGvn\",\"zh-cn_guide_dev-guide.md\":\"BV_pWwQI\",\"es-es_component_anchor.md\":\"GUhPr7-r\",\"es-es_component_scrollbar.md\":\"BJ4Sp1v7\",\"zh-cn_guide_namespace.md\":\"C_br_FjN\",\"es-es_component_watermark.md\":\"KWtMBSEF\",\"zh-cn_component_message.md\":\"BAoH4fXL\",\"zh-cn_component_tree-v2.md\":\"DZRwWT2C\",\"zh-cn_component_timeline.md\":\"CdW_NQV1\",\"zh-cn_component_upload.md\":\"3qbuGZ99\",\"zh-cn_component_anchor.md\":\"CVT9LC1f\",\"en-us_component_divider.md\":\"BqJ7mxyo\",\"zh-cn_component_notification.md\":\"BU8NUNSl\",\"en-us_component_tooltip.md\":\"BHeO0Doy\",\"es-es_component_select.md\":\"DEFlUHtD\",\"es-es_component_switch.md\":\"DrqsKEIN\",\"es-es_component_page-header.md\":\"CDbNJuMz\",\"es-es_component_color.md\":\"DCNV36fq\",\"zh-cn_component_color.md\":\"CcBqrkJz\",\"zh-cn_component_select-v2.md\":\"mxiigrGl\",\"es-es_component_tabs.md\":\"DjFLQGhM\",\"es-es_component_divider.md\":\"DBRsBvjp\",\"en-us_component_avatar.md\":\"DWS7Fd0C\",\"en-us_component_container.md\":\"vY80ziL-\",\"zh-cn_component_switch.md\":\"DO5I-QSX\",\"zh-cn_component_divider.md\":\"DxIERZP0\",\"zh-cn_component_tabs.md\":\"C3OHQeUx\",\"en-us_component_tabs.md\":\"DucTd7_U\",\"en-us_component_watermark.md\":\"D3yeY-Um\",\"en-us_component_affix.md\":\"BJ_SX5O5\",\"en-us_component_anchor.md\":\"D4cvSyYW\",\"zh-cn_component_menu.md\":\"BVS78FqT\",\"en-us_component_switch.md\":\"mWdkrSeS\",\"en-us_guide_theming.md\":\"BoCOczvw\",\"en-us_component_layout.md\":\"CgNEO3Qv\",\"zh-cn_component_datetime-picker.md\":\"ByXnpOl-\",\"en-us_guide_translation.md\":\"BJgVWgZf\",\"en-us_component_image.md\":\"CXirJdHO\",\"en-us_component_form.md\":\"QmiWXOM2\",\"zh-cn_component_time-select.md\":\"Dr1RNtjr\",\"zh-cn_component_typography.md\":\"DiKrJ4Pu\",\"en-us_component_loading.md\":\"Ce4OOZv8\",\"zh-cn_component_icon.md\":\"CJfKbnRg\",\"zh-cn_component_link.md\":\"BhDy2uJO\",\"en-us_component_space.md\":\"srTjsB70\",\"en-us_component_rate.md\":\"BE1_c1fk\",\"zh-cn_component_popconfirm.md\":\"BpzhHC0z\",\"zh-cn_component_input-number.md\":\"CtEM4rlG\",\"zh-cn_component_image.md\":\"DBp2OC3Z\",\"zh-cn_guide_ssr.md\":\"DOGF6s4I\",\"en-us_component_scrollbar.md\":\"KgBsePz3\",\"es-es_component_alert.md\":\"DCv5h-Vk\",\"zh-cn_component_mention.md\":\"p2_vY0SA\",\"zh-cn_component_input.md\":\"KmdGFRAr\",\"zh-cn_component_date-picker.md\":\"-Ke9xuzD\",\"zh-cn_component_descriptions.md\":\"Bm7wmY8J\",\"es-es_component_autocomplete.md\":\"B18rJxag\",\"es-es_component_breadcrumb.md\":\"B8_ACYR2\",\"en-us_guide_commit-examples.md\":\"B8VJ1Bww\",\"zh-cn_guide_quickstart.md\":\"7BP2pAZy\",\"zh-cn_component_select.md\":\"Z7ZdQ9Ak\",\"zh-cn_component_pagination.md\":\"DWHIGFLf\",\"zh-cn_component_tooltip.md\":\"KuM-ipUD\",\"zh-cn_component_tag.md\":\"LGSsvblP\",\"en-us_component_steps.md\":\"BT3sQQJg\",\"zh-cn_component_rate.md\":\"BFpX5jME\",\"zh-cn_component_form.md\":\"Bwbq-ols\",\"zh-cn_component_dropdown.md\":\"CgyKPsTQ\",\"zh-cn_component_message-box.md\":\"BkEjpxmO\",\"zh-cn_component_time-picker.md\":\"DRYhd-e3\",\"es-es_component_table.md\":\"U5fEfPwN\",\"es-es_component_backtop.md\":\"DND1PNSx\",\"en-us_component_table.md\":\"Dj-cwAX7\",\"zh-cn_guide_installation.md\":\"28Qiswm1\",\"zh-cn_component_table.md\":\"LJCOmrCl\",\"es-es_component_table-v2.md\":\"C_X70wMr\",\"en-us_component_table-v2.md\":\"BeFochcV\",\"zh-cn_component_table-v2.md\":\"w_GGZaGb\"}");window.__VP_SITE_DATA__=JSON.parse("{\"lang\":\"en-US\",\"dir\":\"ltr\",\"title\":\"Element Plus\",\"description\":\"A Vue 3 based component library for designers and developers\",\"base\":\"/\",\"head\":[],\"router\":{\"prefetchLinks\":true},\"appearance\":true,\"themeConfig\":{\"repo\":\"element-plus/element-plus\",\"docsBranch\":\"dev\",\"docsDir\":\"docs\",\"editLinks\":true,\"editLinkText\":\"Edit this page on GitHub\",\"logo\":\"/images/element-plus-logo.svg\",\"logoSmall\":\"/images/element-plus-logo-small.svg\",\"sidebars\":{\"/guide/\":{\"en-US\":[{\"text\":\"Basics\",\"children\":[{\"text\":\"Design\",\"link\":\"/en-US/guide/design\"},{\"text\":\"Navigation\",\"link\":\"/en-US/guide/nav\"},{\"text\":\"Installation\",\"link\":\"/en-US/guide/installation\"},{\"text\":\"Quick Start\",\"link\":\"/en-US/guide/quickstart\"}]},{\"text\":\"Advanced\",\"children\":[{\"text\":\"i18n\",\"link\":\"/en-US/guide/i18n\"},{\"text\":\"Migration from ElementUI\",\"link\":\"/en-US/guide/migration\"},{\"text\":\"Theming\",\"link\":\"/en-US/guide/theming\"},{\"text\":\"Dark Mode\",\"link\":\"/en-US/guide/dark-mode\",\"promotion\":\"2.2.0\"},{\"text\":\"Custom Namespace\",\"link\":\"/en-US/guide/namespace\",\"promotion\":\"2.2.0\"},{\"text\":\"SSR\",\"link\":\"/en-US/guide/ssr\"},{\"text\":\"Built-in Transitions\",\"link\":\"/en-US/guide/transitions\"},{\"text\":\"Changelog\",\"link\":\"/en-US/guide/changelog\"}]},{\"text\":\"Development\",\"children\":[{\"text\":\"Development Guide\",\"link\":\"/en-US/guide/dev-guide\"},{\"text\":\"Development FAQ\",\"link\":\"/en-US/guide/dev-faq\"},{\"text\":\"Commit Examples\",\"link\":\"/en-US/guide/commit-examples\"},{\"text\":\"Translation\",\"link\":\"/en-US/guide/translation\"}]}],\"es-ES\":[{\"text\":\"Basics\",\"children\":[{\"text\":\"Design\",\"link\":\"/es-ES/guide/design\"},{\"text\":\"Navigation\",\"link\":\"/es-ES/guide/nav\"},{\"text\":\"Installation\",\"link\":\"/es-ES/guide/installation\"},{\"text\":\"Quick Start\",\"link\":\"/es-ES/guide/quickstart\"}]},{\"text\":\"Advanced\",\"children\":[{\"text\":\"i18n\",\"link\":\"/es-ES/guide/i18n\"},{\"text\":\"Migración desde ElementUI\",\"link\":\"/es-ES/guide/migration\"},{\"text\":\"Theming\",\"link\":\"/es-ES/guide/theming\"},{\"text\":\"Dark Mode\",\"link\":\"/es-ES/guide/dark-mode\",\"promotion\":\"2.2.0\"},{\"text\":\"Custom Namespace\",\"link\":\"/es-ES/guide/namespace\",\"promotion\":\"2.2.0\"},{\"text\":\"SSR\",\"link\":\"/es-ES/guide/ssr\"},{\"text\":\"Built-in Transitions\",\"link\":\"/es-ES/guide/transitions\"},{\"text\":\"Changelog\",\"link\":\"/es-ES/guide/changelog\"}]},{\"text\":\"Development\",\"children\":[{\"text\":\"Development Guide\",\"link\":\"/es-ES/guide/dev-guide\"},{\"text\":\"Development FAQ\",\"link\":\"/es-ES/guide/dev-faq\"},{\"text\":\"Commit Examples\",\"link\":\"/es-ES/guide/commit-examples\"},{\"text\":\"Translation\",\"link\":\"/es-ES/guide/translation\"}]}],\"zh-CN\":[{\"text\":\"基础\",\"children\":[{\"text\":\"设计\",\"link\":\"/zh-CN/guide/design\"},{\"text\":\"导航\",\"link\":\"/zh-CN/guide/nav\"},{\"text\":\"安装\",\"link\":\"/zh-CN/guide/installation\"},{\"text\":\"快速开始\",\"link\":\"/zh-CN/guide/quickstart\"}]},{\"text\":\"进阶\",\"children\":[{\"text\":\"国际化\",\"link\":\"/zh-CN/guide/i18n\"},{\"text\":\"从 Element UI 升级\",\"link\":\"/zh-CN/guide/migration\"},{\"text\":\"主题\",\"link\":\"/zh-CN/guide/theming\"},{\"text\":\"暗黑模式\",\"link\":\"/zh-CN/guide/dark-mode\",\"promotion\":\"2.2.0\"},{\"text\":\"自定义命名空间\",\"link\":\"/zh-CN/guide/namespace\",\"promotion\":\"2.2.0\"},{\"text\":\"SSR\",\"link\":\"/zh-CN/guide/ssr\"},{\"text\":\"内置过渡动画\",\"link\":\"/zh-CN/guide/transitions\"},{\"text\":\"更新日志\",\"link\":\"/zh-CN/guide/changelog\"}]},{\"text\":\"开发\",\"children\":[{\"text\":\"开发指南\",\"link\":\"/zh-CN/guide/dev-guide\"},{\"text\":\"开发常见问题\",\"link\":\"/zh-CN/guide/dev-faq\"},{\"text\":\"提交示例\",\"link\":\"/zh-CN/guide/commit-examples\"},{\"text\":\"翻译\",\"link\":\"/zh-CN/guide/translation\"}]}]},\"/component/\":{\"en-US\":[{\"text\":\"Overview\",\"children\":[{\"link\":\"/en-US/component/overview\",\"text\":\"Overview\"}]},{\"text\":\"Basic\",\"children\":[{\"link\":\"/en-US/component/button\",\"text\":\"Button\"},{\"link\":\"/en-US/component/border\",\"text\":\"Border\"},{\"link\":\"/en-US/component/color\",\"text\":\"Color\"},{\"link\":\"/en-US/component/container\",\"text\":\"Layout Container\"},{\"link\":\"/en-US/component/icon\",\"text\":\"Icon\"},{\"link\":\"/en-US/component/layout\",\"text\":\"Layout\"},{\"link\":\"/en-US/component/link\",\"text\":\"Link\"},{\"link\":\"/en-US/component/text\",\"text\":\"Text\",\"promotion\":\"2.3.0\"},{\"link\":\"/en-US/component/scrollbar\",\"text\":\"Scrollbar\"},{\"link\":\"/en-US/component/space\",\"text\":\"Space\"},{\"link\":\"/en-US/component/typography\",\"text\":\"Typography\"}]},{\"text\":\"Configuration\",\"children\":[{\"link\":\"/en-US/component/config-provider\",\"text\":\"Config Provider\"}]},{\"text\":\"Form\",\"children\":[{\"link\":\"/en-US/component/autocomplete\",\"text\":\"Autocomplete\"},{\"link\":\"/en-US/component/cascader\",\"text\":\"Cascader\"},{\"link\":\"/en-US/component/checkbox\",\"text\":\"Checkbox\"},{\"link\":\"/en-US/component/color-picker\",\"text\":\"Color Picker\"},{\"link\":\"/en-US/component/date-picker\",\"text\":\"Date Picker\"},{\"link\":\"/en-US/component/datetime-picker\",\"text\":\"DateTime Picker\"},{\"link\":\"/en-US/component/form\",\"text\":\"Form\"},{\"link\":\"/en-US/component/input\",\"text\":\"Input\"},{\"link\":\"/en-US/component/input-number\",\"text\":\"Input Number\"},{\"link\":\"/en-US/component/mention\",\"text\":\"Mention\",\"promotion\":\"2.8.0\"},{\"link\":\"/en-US/component/radio\",\"text\":\"Radio\"},{\"link\":\"/en-US/component/rate\",\"text\":\"Rate\"},{\"link\":\"/en-US/component/select\",\"text\":\"Select\"},{\"link\":\"/en-US/component/select-v2\",\"text\":\"Virtualized Select\"},{\"link\":\"/en-US/component/slider\",\"text\":\"Slider\"},{\"link\":\"/en-US/component/switch\",\"text\":\"Switch\"},{\"link\":\"/en-US/component/time-picker\",\"text\":\"Time Picker\"},{\"link\":\"/en-US/component/time-select\",\"text\":\"Time Select\"},{\"link\":\"/en-US/component/transfer\",\"text\":\"Transfer\"},{\"link\":\"/en-US/component/tree-select\",\"text\":\"TreeSelect\",\"promotion\":\"2.1.8\"},{\"link\":\"/en-US/component/upload\",\"text\":\"Upload\"}]},{\"text\":\"Data\",\"children\":[{\"link\":\"/en-US/component/avatar\",\"text\":\"Avatar\"},{\"link\":\"/en-US/component/badge\",\"text\":\"Badge\"},{\"link\":\"/en-US/component/calendar\",\"text\":\"Calendar\"},{\"link\":\"/en-US/component/card\",\"text\":\"Card\"},{\"link\":\"/en-US/component/carousel\",\"text\":\"Carousel\"},{\"link\":\"/en-US/component/collapse\",\"text\":\"Collapse\"},{\"link\":\"/en-US/component/descriptions\",\"text\":\"Descriptions\"},{\"link\":\"/en-US/component/empty\",\"text\":\"Empty\"},{\"link\":\"/en-US/component/image\",\"text\":\"Image\"},{\"link\":\"/en-US/component/infinite-scroll\",\"text\":\"Infinite Scroll\"},{\"link\":\"/en-US/component/pagination\",\"text\":\"Pagination\"},{\"link\":\"/en-US/component/progress\",\"text\":\"Progress\"},{\"link\":\"/en-US/component/result\",\"text\":\"Result\"},{\"link\":\"/en-US/component/skeleton\",\"text\":\"Skeleton\"},{\"link\":\"/en-US/component/table\",\"text\":\"Table\"},{\"link\":\"/en-US/component/table-v2\",\"text\":\"Virtualized Table\",\"promotion\":\"2.2.0\"},{\"link\":\"/en-US/component/tag\",\"text\":\"Tag\"},{\"link\":\"/en-US/component/timeline\",\"text\":\"Timeline\"},{\"link\":\"/en-US/component/tour\",\"text\":\"Tour\",\"promotion\":\"2.5.0\"},{\"link\":\"/en-US/component/tree\",\"text\":\"Tree\"},{\"link\":\"/en-US/component/tree-v2\",\"text\":\"Virtualized Tree\"},{\"link\":\"/en-US/component/statistic\",\"text\":\"Statistic\",\"promotion\":\"2.2.30\"},{\"link\":\"/en-US/component/segmented\",\"text\":\"Segmented\",\"promotion\":\"2.7.0\"}]},{\"text\":\"Navigation\",\"children\":[{\"link\":\"/en-US/component/affix\",\"text\":\"Affix\"},{\"link\":\"/en-US/component/anchor\",\"text\":\"Anchor\",\"promotion\":\"2.6.0\"},{\"link\":\"/en-US/component/backtop\",\"text\":\"Backtop\"},{\"link\":\"/en-US/component/breadcrumb\",\"text\":\"Breadcrumb\"},{\"link\":\"/en-US/component/dropdown\",\"text\":\"Dropdown\"},{\"link\":\"/en-US/component/menu\",\"text\":\"Menu\"},{\"link\":\"/en-US/component/page-header\",\"text\":\"Page Header\"},{\"link\":\"/en-US/component/steps\",\"text\":\"Steps\"},{\"link\":\"/en-US/component/tabs\",\"text\":\"Tabs\"}]},{\"text\":\"Feedback\",\"children\":[{\"link\":\"/en-US/component/alert\",\"text\":\"Alert\"},{\"link\":\"/en-US/component/dialog\",\"text\":\"Dialog\"},{\"link\":\"/en-US/component/drawer\",\"text\":\"Drawer\"},{\"link\":\"/en-US/component/loading\",\"text\":\"Loading\"},{\"link\":\"/en-US/component/message\",\"text\":\"Message\"},{\"link\":\"/en-US/component/message-box\",\"text\":\"Message Box\"},{\"link\":\"/en-US/component/notification\",\"text\":\"Notification\"},{\"link\":\"/en-US/component/popconfirm\",\"text\":\"Popconfirm\"},{\"link\":\"/en-US/component/popover\",\"text\":\"Popover\"},{\"link\":\"/en-US/component/tooltip\",\"text\":\"Tooltip\"}]},{\"text\":\"Others\",\"children\":[{\"link\":\"/en-US/component/divider\",\"text\":\"Divider\"},{\"link\":\"/en-US/component/watermark\",\"text\":\"Watermark\",\"promotion\":\"2.4.0\"}]}],\"es-ES\":[{\"text\":\"Overview\",\"children\":[{\"link\":\"/es-ES/component/overview\",\"text\":\"Overview\"}]},{\"text\":\"Basic\",\"children\":[{\"link\":\"/es-ES/component/button\",\"text\":\"Button\"},{\"link\":\"/es-ES/component/border\",\"text\":\"Border\"},{\"link\":\"/es-ES/component/color\",\"text\":\"Color\"},{\"link\":\"/es-ES/component/container\",\"text\":\"Layout Container\"},{\"link\":\"/es-ES/component/icon\",\"text\":\"Icon\"},{\"link\":\"/es-ES/component/layout\",\"text\":\"Layout\"},{\"link\":\"/es-ES/component/link\",\"text\":\"Link\"},{\"link\":\"/es-ES/component/text\",\"text\":\"Text\",\"promotion\":\"2.3.0\"},{\"link\":\"/es-ES/component/scrollbar\",\"text\":\"Scrollbar\"},{\"link\":\"/es-ES/component/space\",\"text\":\"Space\"},{\"link\":\"/es-ES/component/typography\",\"text\":\"Typography\"}]},{\"text\":\"Configuration\",\"children\":[{\"link\":\"/es-ES/component/config-provider\",\"text\":\"Config Provider\"}]},{\"text\":\"Form\",\"children\":[{\"link\":\"/es-ES/component/autocomplete\",\"text\":\"Autocomplete\"},{\"link\":\"/es-ES/component/cascader\",\"text\":\"Cascader\"},{\"link\":\"/es-ES/component/checkbox\",\"text\":\"Checkbox\"},{\"link\":\"/es-ES/component/color-picker\",\"text\":\"Color Picker\"},{\"link\":\"/es-ES/component/date-picker\",\"text\":\"Date Picker\"},{\"link\":\"/es-ES/component/datetime-picker\",\"text\":\"DateTime Picker\"},{\"link\":\"/es-ES/component/form\",\"text\":\"Form\"},{\"link\":\"/es-ES/component/input\",\"text\":\"Input\"},{\"link\":\"/es-ES/component/input-number\",\"text\":\"Input Number\"},{\"link\":\"/es-ES/component/mention\",\"text\":\"Mention\",\"promotion\":\"2.8.0\"},{\"link\":\"/es-ES/component/radio\",\"text\":\"Radio\"},{\"link\":\"/es-ES/component/rate\",\"text\":\"Rate\"},{\"link\":\"/es-ES/component/select\",\"text\":\"Select\"},{\"link\":\"/es-ES/component/select-v2\",\"text\":\"Virtualized Select\"},{\"link\":\"/es-ES/component/slider\",\"text\":\"Slider\"},{\"link\":\"/es-ES/component/switch\",\"text\":\"Switch\"},{\"link\":\"/es-ES/component/time-picker\",\"text\":\"Time Picker\"},{\"link\":\"/es-ES/component/time-select\",\"text\":\"Time Select\"},{\"link\":\"/es-ES/component/transfer\",\"text\":\"Transfer\"},{\"link\":\"/es-ES/component/tree-select\",\"text\":\"TreeSelect\",\"promotion\":\"2.1.8\"},{\"link\":\"/es-ES/component/upload\",\"text\":\"Upload\"}]},{\"text\":\"Data\",\"children\":[{\"link\":\"/es-ES/component/avatar\",\"text\":\"Avatar\"},{\"link\":\"/es-ES/component/badge\",\"text\":\"Badge\"},{\"link\":\"/es-ES/component/calendar\",\"text\":\"Calendar\"},{\"link\":\"/es-ES/component/card\",\"text\":\"Card\"},{\"link\":\"/es-ES/component/carousel\",\"text\":\"Carousel\"},{\"link\":\"/es-ES/component/collapse\",\"text\":\"Collapse\"},{\"link\":\"/es-ES/component/descriptions\",\"text\":\"Descriptions\"},{\"link\":\"/es-ES/component/empty\",\"text\":\"Empty\"},{\"link\":\"/es-ES/component/image\",\"text\":\"Image\"},{\"link\":\"/es-ES/component/infinite-scroll\",\"text\":\"Infinite Scroll\"},{\"link\":\"/es-ES/component/pagination\",\"text\":\"Pagination\"},{\"link\":\"/es-ES/component/progress\",\"text\":\"Progress\"},{\"link\":\"/es-ES/component/result\",\"text\":\"Result\"},{\"link\":\"/es-ES/component/skeleton\",\"text\":\"Skeleton\"},{\"link\":\"/es-ES/component/table\",\"text\":\"Table\"},{\"link\":\"/es-ES/component/table-v2\",\"text\":\"Virtualized Table\",\"promotion\":\"2.2.0\"},{\"link\":\"/es-ES/component/tag\",\"text\":\"Tag\"},{\"link\":\"/es-ES/component/timeline\",\"text\":\"Timeline\"},{\"link\":\"/es-ES/component/tour\",\"text\":\"Tour\",\"promotion\":\"2.5.0\"},{\"link\":\"/es-ES/component/tree\",\"text\":\"Tree\"},{\"link\":\"/es-ES/component/tree-v2\",\"text\":\"Virtualized Tree\"},{\"link\":\"/es-ES/component/statistic\",\"text\":\"Statistic\",\"promotion\":\"2.2.30\"},{\"link\":\"/es-ES/component/segmented\",\"text\":\"Segmented\",\"promotion\":\"2.7.0\"}]},{\"text\":\"Navigation\",\"children\":[{\"link\":\"/es-ES/component/affix\",\"text\":\"Affix\"},{\"link\":\"/es-ES/component/anchor\",\"text\":\"Anchor\",\"promotion\":\"2.6.0\"},{\"link\":\"/es-ES/component/backtop\",\"text\":\"Backtop\"},{\"link\":\"/es-ES/component/breadcrumb\",\"text\":\"Breadcrumb\"},{\"link\":\"/es-ES/component/dropdown\",\"text\":\"Dropdown\"},{\"link\":\"/es-ES/component/menu\",\"text\":\"Menu\"},{\"link\":\"/es-ES/component/page-header\",\"text\":\"Page Header\"},{\"link\":\"/es-ES/component/steps\",\"text\":\"Steps\"},{\"link\":\"/es-ES/component/tabs\",\"text\":\"Tabs\"}]},{\"text\":\"Feedback\",\"children\":[{\"link\":\"/es-ES/component/alert\",\"text\":\"Alert\"},{\"link\":\"/es-ES/component/dialog\",\"text\":\"Dialog\"},{\"link\":\"/es-ES/component/drawer\",\"text\":\"Drawer\"},{\"link\":\"/es-ES/component/loading\",\"text\":\"Loading\"},{\"link\":\"/es-ES/component/message\",\"text\":\"Message\"},{\"link\":\"/es-ES/component/message-box\",\"text\":\"Message Box\"},{\"link\":\"/es-ES/component/notification\",\"text\":\"Notification\"},{\"link\":\"/es-ES/component/popconfirm\",\"text\":\"Popconfirm\"},{\"link\":\"/es-ES/component/popover\",\"text\":\"Popover\"},{\"link\":\"/es-ES/component/tooltip\",\"text\":\"Tooltip\"}]},{\"text\":\"Others\",\"children\":[{\"link\":\"/es-ES/component/divider\",\"text\":\"Divider\"},{\"link\":\"/es-ES/component/watermark\",\"text\":\"Watermark\",\"promotion\":\"2.4.0\"}]}],\"zh-CN\":[{\"text\":\"Overview 组件总览\",\"children\":[{\"link\":\"/zh-CN/component/overview\",\"text\":\"Overview 组件总览\"}]},{\"text\":\"Basic 基础组件\",\"children\":[{\"link\":\"/zh-CN/component/button\",\"text\":\"Button 按钮\"},{\"link\":\"/zh-CN/component/border\",\"text\":\"Border 边框\"},{\"link\":\"/zh-CN/component/color\",\"text\":\"Color 色彩\"},{\"link\":\"/zh-CN/component/container\",\"text\":\"Container 布局容器\"},{\"link\":\"/zh-CN/component/icon\",\"text\":\"Icon 图标\"},{\"link\":\"/zh-CN/component/layout\",\"text\":\"Layout 布局\"},{\"link\":\"/zh-CN/component/link\",\"text\":\"Link 链接\"},{\"link\":\"/zh-CN/component/text\",\"text\":\"Text 文本\",\"promotion\":\"2.3.0\"},{\"link\":\"/zh-CN/component/scrollbar\",\"text\":\"Scrollbar 滚动条\"},{\"link\":\"/zh-CN/component/space\",\"text\":\"Space 间距\"},{\"link\":\"/zh-CN/component/typography\",\"text\":\"Typography 排版\"}]},{\"text\":\"配置组件\",\"children\":[{\"link\":\"/zh-CN/component/config-provider\",\"text\":\"Config Provider 全局配置\"}]},{\"text\":\"Form 表单组件\",\"children\":[{\"link\":\"/zh-CN/component/autocomplete\",\"text\":\"Autocomplete 自动补全输入框\"},{\"link\":\"/zh-CN/component/cascader\",\"text\":\"Cascader 级联选择器\"},{\"link\":\"/zh-CN/component/checkbox\",\"text\":\"Checkbox 多选框\"},{\"link\":\"/zh-CN/component/color-picker\",\"text\":\"Color Picker 取色器\"},{\"link\":\"/zh-CN/component/date-picker\",\"text\":\"Date Picker 日期选择器\"},{\"link\":\"/zh-CN/component/datetime-picker\",\"text\":\"DateTime Picker 日期时间选择器\"},{\"link\":\"/zh-CN/component/form\",\"text\":\"Form 表单\"},{\"link\":\"/zh-CN/component/input\",\"text\":\"Input 输入框\"},{\"link\":\"/zh-CN/component/input-number\",\"text\":\"Input Number 数字输入框\"},{\"link\":\"/zh-CN/component/mention\",\"text\":\"Mention 提及\",\"promotion\":\"2.8.0\"},{\"link\":\"/zh-CN/component/radio\",\"text\":\"Radio 单选框\"},{\"link\":\"/zh-CN/component/rate\",\"text\":\"Rate 评分\"},{\"link\":\"/zh-CN/component/select\",\"text\":\"Select 选择器\"},{\"link\":\"/zh-CN/component/select-v2\",\"text\":\"Virtualized Select 虚拟化选择器\"},{\"link\":\"/zh-CN/component/slider\",\"text\":\"Slider 滑块\"},{\"link\":\"/zh-CN/component/switch\",\"text\":\"Switch 开关\"},{\"link\":\"/zh-CN/component/time-picker\",\"text\":\"Time Picker 时间选择器\"},{\"link\":\"/zh-CN/component/time-select\",\"text\":\"Time Select 时间选择\"},{\"link\":\"/zh-CN/component/transfer\",\"text\":\"Transfer 穿梭框\"},{\"link\":\"/zh-CN/component/tree-select\",\"text\":\"TreeSelect 树形选择\",\"promotion\":\"2.1.8\"},{\"link\":\"/zh-CN/component/upload\",\"text\":\"Upload 上传\"}]},{\"text\":\"Data 数据展示\",\"children\":[{\"link\":\"/zh-CN/component/avatar\",\"text\":\"Avatar 头像\"},{\"link\":\"/zh-CN/component/badge\",\"text\":\"Badge 徽章\"},{\"link\":\"/zh-CN/component/calendar\",\"text\":\"Calendar 日历\"},{\"link\":\"/zh-CN/component/card\",\"text\":\"Card 卡片\"},{\"link\":\"/zh-CN/component/carousel\",\"text\":\"Carousel 走马灯\"},{\"link\":\"/zh-CN/component/collapse\",\"text\":\"Collapse 折叠面板\"},{\"link\":\"/zh-CN/component/descriptions\",\"text\":\"Descriptions 描述列表\"},{\"link\":\"/zh-CN/component/empty\",\"text\":\"Empty 空状态\"},{\"link\":\"/zh-CN/component/image\",\"text\":\"Image 图片\"},{\"link\":\"/zh-CN/component/infinite-scroll\",\"text\":\"Infinite Scroll 无限滚动\"},{\"link\":\"/zh-CN/component/pagination\",\"text\":\"Pagination 分页\"},{\"link\":\"/zh-CN/component/progress\",\"text\":\"Progress 进度条\"},{\"link\":\"/zh-CN/component/result\",\"text\":\"Result 结果\"},{\"link\":\"/zh-CN/component/skeleton\",\"text\":\"Skeleton 骨架屏\"},{\"link\":\"/zh-CN/component/table\",\"text\":\"Table 表格\"},{\"link\":\"/zh-CN/component/table-v2\",\"text\":\"Virtualized Table 虚拟化表格\",\"promotion\":\"2.2.0\"},{\"link\":\"/zh-CN/component/tag\",\"text\":\"Tag 标签\"},{\"link\":\"/zh-CN/component/timeline\",\"text\":\"Timeline 时间线\"},{\"link\":\"/zh-CN/component/tour\",\"text\":\"Tour 漫游式引导\",\"promotion\":\"2.5.0\"},{\"link\":\"/zh-CN/component/tree\",\"text\":\"Tree 树形控件\"},{\"link\":\"/zh-CN/component/tree-v2\",\"text\":\"Virtualized Tree 虚拟化树形控件\"},{\"link\":\"/zh-CN/component/statistic\",\"text\":\"Statistic 统计组件\",\"promotion\":\"2.2.30\"},{\"link\":\"/zh-CN/component/segmented\",\"text\":\"Segmented 分段控制器\",\"promotion\":\"2.7.0\"}]},{\"text\":\"Navigation 导航\",\"children\":[{\"link\":\"/zh-CN/component/affix\",\"text\":\"Affix 固钉\"},{\"link\":\"/zh-CN/component/anchor\",\"text\":\"Anchor 锚点\",\"promotion\":\"2.6.0\"},{\"link\":\"/zh-CN/component/backtop\",\"text\":\"Backtop 回到顶部\"},{\"link\":\"/zh-CN/component/breadcrumb\",\"text\":\"Breadcrumb 面包屑\"},{\"link\":\"/zh-CN/component/dropdown\",\"text\":\"Dropdown 下拉菜单\"},{\"link\":\"/zh-CN/component/menu\",\"text\":\"Menu 菜单\"},{\"link\":\"/zh-CN/component/page-header\",\"text\":\"Page Header 页头\"},{\"link\":\"/zh-CN/component/steps\",\"text\":\"Steps 步骤条\"},{\"link\":\"/zh-CN/component/tabs\",\"text\":\"Tabs 标签页\"}]},{\"text\":\"Feedback 反馈组件\",\"children\":[{\"link\":\"/zh-CN/component/alert\",\"text\":\"Alert 提示\"},{\"link\":\"/zh-CN/component/dialog\",\"text\":\"Dialog 对话框\"},{\"link\":\"/zh-CN/component/drawer\",\"text\":\"Drawer 抽屉\"},{\"link\":\"/zh-CN/component/loading\",\"text\":\"Loading 加载\"},{\"link\":\"/zh-CN/component/message\",\"text\":\"Message 消息提示\"},{\"link\":\"/zh-CN/component/message-box\",\"text\":\"Message Box 消息弹出框\"},{\"link\":\"/zh-CN/component/notification\",\"text\":\"Notification 通知\"},{\"link\":\"/zh-CN/component/popconfirm\",\"text\":\"Popconfirm 气泡确认框\"},{\"link\":\"/zh-CN/component/popover\",\"text\":\"Popover 弹出框\"},{\"link\":\"/zh-CN/component/tooltip\",\"text\":\"Tooltip 文字提示\"}]},{\"text\":\"Others 其他\",\"children\":[{\"link\":\"/zh-CN/component/divider\",\"text\":\"Divider 分割线\"},{\"link\":\"/zh-CN/component/watermark\",\"text\":\"Watermark 水印 \",\"promotion\":\"2.4.0\"}]}]}},\"nav\":{\"en-US\":[{\"text\":\"Guide\",\"link\":\"/en-US/guide/design\",\"activeMatch\":\"/guide/\"},{\"text\":\"Component\",\"link\":\"/en-US/component/overview\",\"activeMatch\":\"/component/\"},{\"text\":\"Resource\",\"link\":\"/en-US/resource/index\",\"activeMatch\":\"/resource/\"}],\"es-ES\":[{\"text\":\"Guías\",\"link\":\"/es-ES/guide/design\",\"activeMatch\":\"/guide/\"},{\"text\":\"Componentes\",\"link\":\"/es-ES/component/overview\",\"activeMatch\":\"/component/\"},{\"text\":\"Recursos\",\"link\":\"/es-ES/resource/index\",\"activeMatch\":\"/resource/\"}],\"zh-CN\":[{\"text\":\"指南\",\"link\":\"/zh-CN/guide/design\",\"activeMatch\":\"/guide/\"},{\"text\":\"组件\",\"link\":\"/zh-CN/component/overview\",\"activeMatch\":\"/component/\"},{\"text\":\"资源\",\"link\":\"/zh-CN/resource/index\",\"activeMatch\":\"/resource/\"}]},\"agolia\":{\"apiKey\":\"99caf32e743ba77d78b095b763b8e380\",\"appId\":\"ZM3TI8AKL4\"},\"features\":{},\"langs\":[\"en-US\",\"es-ES\",\"zh-CN\"]},\"locales\":{\"/en-US\":{\"label\":\"en-US\",\"lang\":\"en-US\"},\"/es-ES\":{\"label\":\"es-ES\",\"lang\":\"es-ES\"},\"/zh-CN\":{\"label\":\"zh-CN\",\"lang\":\"zh-CN\"}},\"scrollOffset\":134,\"cleanUrls\":false}");</script>
    
  </body>
</html>